Remove 'type' attribute from <typed-field>

... because it's excessive and can be calculated from 'value' attribute.

Change-Id: Id56024027ee455518619f1ee846d0b0735d5210d
This commit is contained in:
Timur Sufiev 2015-08-04 13:02:16 -07:00
parent c25b7d8507
commit d6e2842979
6 changed files with 20 additions and 21 deletions

View File

@ -51,14 +51,14 @@
<div ng-repeat="(label, field) in row track by field.uid()"> <div ng-repeat="(label, field) in row track by field.uid()">
<div ng-if="field.isAtomic()" class="col-xs-6"> <div ng-if="field.isAtomic()" class="col-xs-6">
<labeled label="label" for="{$ field.uid() $}"> <labeled label="label" for="{$ field.uid() $}">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</labeled> </labeled>
</div> </div>
<div ng-if="!field.isAtomic()" class="col-xs-12"> <div ng-if="!field.isAtomic()" class="col-xs-12">
<collapsible-group content="field" title="label" <collapsible-group content="field" title="label"
additive="{$ field.isAdditive() $}" on-add="field.add()"> additive="{$ field.isAdditive() $}" on-add="field.add()">
<div ng-class="field.isPlainStructure() ? 'col-xs-6' : 'col-xs-12'"> <div ng-class="field.isPlainStructure() ? 'col-xs-6' : 'col-xs-12'">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</div> </div>
</collapsible-group> </collapsible-group>
</div> </div>

View File

@ -221,11 +221,11 @@
return { return {
restrict: 'E', restrict: 'E',
scope: { scope: {
value: '=', value: '='
type: '@'
}, },
link: function(scope, element) { link: function(scope, element) {
templates.templateReady(scope.type).then(function(template) { var type = scope.value.getType();
templates.templateReady(type).then(function(template) {
element.append($compile(template)(scope)); element.append($compile(template)(scope));
}); });
} }

View File

@ -3,7 +3,7 @@
<div ng-repeat="(key, field) in value | extractFields track by field.uid()"> <div ng-repeat="(key, field) in value | extractFields track by field.uid()">
<labeled ng-if="field.isAtomic()" label="field.keyValue" for="{$ field.uid() $}"> <labeled ng-if="field.isAtomic()" label="field.keyValue" for="{$ field.uid() $}">
<div class="input-group"> <div class="input-group">
<typed-field id="{$ field.uid() $}" value="field" type="{$ field.getType() $}"></typed-field> <typed-field id="{$ field.uid() $}" value="field"></typed-field>
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-default" ng-click="value.removeItem(field.keyValue())"> <button class="btn btn-default" ng-click="value.removeItem(field.keyValue())">
<i class="fa fa-minus-circle"></i> <i class="fa fa-minus-circle"></i>
@ -15,10 +15,9 @@
<collapsible-group ng-if="!field.inline" class="col-xs-12" title="field.keyValue" <collapsible-group ng-if="!field.inline" class="col-xs-12" title="field.keyValue"
on-remove="value.removeItem(field.keyValue())" on-remove="value.removeItem(field.keyValue())"
additive="{$ field.isAdditive() $}" on-add="field.add()"> additive="{$ field.isAdditive() $}" on-add="field.add()">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</collapsible-group> </collapsible-group>
<typed-field ng-if="field.inline" <typed-field ng-if="field.inline" value="field"></typed-field>
value="field" type="{$ field.getType() $}"></typed-field>
</div> </div>
</div> </div>
</div> </div>

View File

@ -3,19 +3,19 @@
<div ng-repeat="(key, field) in row track by field.uid()"> <div ng-repeat="(key, field) in row track by field.uid()">
<div ng-if="field.isAtomic()" class="col-xs-6"> <div ng-if="field.isAtomic()" class="col-xs-6">
<labeled label="key" for="{$ field.uid() $}"> <labeled label="key" for="{$ field.uid() $}">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</labeled> </labeled>
</div> </div>
<div ng-if="!field.isAtomic()"> <div ng-if="!field.isAtomic()">
<collapsible-group ng-if="!field.inline" class="col-xs-12" title="key" <collapsible-group ng-if="!field.inline" class="col-xs-12" title="key"
additive="{$ field.isAdditive() $}" on-add="field.add()"> additive="{$ field.isAdditive() $}" on-add="field.add()">
<div ng-class="field.isPlainStructure() ? 'col-xs-6' : 'col-xs-12'"> <div ng-class="field.isPlainStructure() ? 'col-xs-6' : 'col-xs-12'">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</div> </div>
</collapsible-group> </collapsible-group>
<labeled ng-if="field.inline" class="col-xs-6" <labeled ng-if="field.inline" class="col-xs-6"
label="key" for="{$ field.uid() $}"> label="key" for="{$ field.uid() $}">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</labeled> </labeled>
</div> </div>
</div> </div>

View File

@ -3,7 +3,7 @@
<div ng-repeat="(index, field) in value | extractFields track by field.uid()"> <div ng-repeat="(index, field) in value | extractFields track by field.uid()">
<div ng-if="field.isAtomic()" class="form-group"> <div ng-if="field.isAtomic()" class="form-group">
<div class="input-group"> <div class="input-group">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-default" ng-click="value.remove($index)"> <button class="btn btn-default" ng-click="value.remove($index)">
<i class="fa fa-minus-circle"></i> <i class="fa fa-minus-circle"></i>
@ -12,7 +12,7 @@
</div> </div>
</div> </div>
<div ng-if="!field.isAtomic()"> <div ng-if="!field.isAtomic()">
<typed-field value="field" type="{$ field.getType() $}"></typed-field> <typed-field value="field"></typed-field>
</div> </div>
</div> </div>
</div> </div>

View File

@ -232,12 +232,12 @@ describe('merlin directives', function() {
'<div><typed-field ' + contents + '></typed-field></div>')($scope); '<div><typed-field ' + contents + '></typed-field></div>')($scope);
} }
it('type of resulting field is determined by `type` attribute', function() { it('type of resulting field is determined by `value.getType` method', function() {
var element1, element2; var element1, element2;
$scope.value1 = {type: 'text'}; $scope.value1 = {getType: function() { return 'text'; }};
$scope.value2 = {type: 'number'}; $scope.value2 = {getType: function() { return 'number'; }};
element1 = makeFieldElem('value="value1" type="{$ value1.type $}"'); element1 = makeFieldElem('value="value1"');
element2 = makeFieldElem('value="value2" type="{$ value2.type $}"'); element2 = makeFieldElem('value="value2"');
$httpBackend.flush(); $httpBackend.flush();
$scope.$digest(); $scope.$digest();
@ -247,8 +247,8 @@ describe('merlin directives', function() {
it('field is not rendered until the corresponding template has been served', function() { it('field is not rendered until the corresponding template has been served', function() {
var element; var element;
$scope.value = {type: 'text'}; $scope.value = {getType: function() {return 'text'; }};
element = makeFieldElem('value="value" type="{$ value.type $}"'); element = makeFieldElem('value="value"');
expect(element.html()).not.toContain('<textarea'); expect(element.html()).not.toContain('<textarea');
$httpBackend.flush(); $httpBackend.flush();