如何使对象/属性显示在指令中？

Question

这是我的指令来显示一个输入字段：

JS：

.directive('isField', function() { 
    return { 
     restrict: 'EA', 
     template: '<div class="form-group">' + 
     '<label class="col-sm-2 control-label">{{prop}}</label>' + 
     '<div class="col-sm-10">' + 
     '<label ng-if="obj.prop" class="control-label" style="font-weight:normal;">Yes</label>' + 
     '<label ng-if="!obj.prop" class="control-label" style="font-weight:normal;">No</label>' + 
     '</div>' + 
    '</div>', 
     scope: { 
      obj: "@obj", 
      prop: "@prop", 
     }, 
     controller: function(){ 
     }, 
     link: function(scope,elem,attr,ctrl){ 
     } 
    }; 
}) 

HTML：

<is-field obj="pano" prop="isOutRoom" class="ng-isolate-scope"> 
    <div class="form-group"> 
    <label class="col-sm-2 control-label ng-binding">isOutRoom</label> 
    <div class="col-sm-10"> 
     <!-- ngIf: obj.prop --> 
     <!-- ngIf: !obj.prop --> 
     <label ng-if="!obj.prop" class="control-label ng-scope" style="font-weight:normal;">No</label> 
     <!-- end ngIf: !obj.prop --> 
    </div> 
    </div> 
</is-field> 

但obj.prop没有被评估，该指令显示No甚至当obj.prop是true。

样品JSON：

pano: 
{ 
    "objectId": "566f915b00b0814d65fa12e0", 
    "isVirtualRoom": true, 
} 

我做得不对的指令的scope:一部分？

Answer 1

我认为错误是在你的模板，正是在NG-如果你的模板应该像

.directive('isField', function() { 
    return { 
    restrict: 'EA', 
    template: '<div class="form-group">' + 
    '<label class="col-sm-2 control-label">{{prop}}</label>' + 
    '<div class="col-sm-10">' + 
    '<label ng-if="prop" class="control-label" style="font-weight:normal;">Yes</label>' + 
    '<label ng-if="!prop" class="control-label" style="font-weight:normal;">No</label>' + 
    '</div>' + 
'</div>', 
    scope: { 
     obj: "@obj", 
     prop: "@prop", 
    }, 
    controller: function($scope){ 

    }, 
    link: function(scope,elem,attr,ctrl){ 
    } 
}; 

}）

这是一个worked demo