7

我是指令的范围属性

当我show用作 attr 名称时，它工作正常。

<span ng-repeat="field in fields">
  <field-pill field="field" show="true"></field-pill>
</span>

应用程序.js

angular.module('app',[]);

angular.module('app')
  .controller('AppCtrl', function($scope){
      $scope.fields = [1,2,3,4];
    });

angular.module('app')
  .directive('fieldPill', function () {
    return {
      template: '<div class="pill">{{field}}:{{show}}--<span ng-show="show">x</span></div>',
      restrict: 'E',
      scope:{
        field: "=",
        "show": "="
      }
    };
  });

（见这个 plunkr http://plnkr.co/edit/AcqmxeCerCOtGaw9dq9t?p=preview）

x-show但是当我用作属性名称时，该指令根本不会加载布尔数据。

<span ng-repeat="field in fields">
  <field-pill field="field" x-show="true"></field-pill>    
</span>

应用程序.js

angular.module('app',[]);

angular.module('app')
  .controller('AppCtrl', function($scope){
      $scope.fields = [1,2,3,4];
    });

angular.module('app')
  .directive('fieldPill', function () {
    return {
      template: '<div class="pill">{{field}}:{{xShow}}--<span ng-show="xShow">x</span></div>',
      restrict: 'E',
      scope:{
        field: "=",
        xShow: "="
      }
    };
  });

谁能解释为什么？

（请参阅此 plunkr 以获取x-show http://plnkr.co/edit/2txoY3VaShH6WggnugcE?p=preview的代码）

4

1 回答 1

14

我认为这与x-前缀有关。如果将其更改为 , 之类mShow的，m-show它将起作用。

从 HTML5规范：

以两个字符“x-”开头的属性名称保留给用户代理使用，并保证永远不会正式添加到 HTML 语言中。出于灵活性考虑，包含下划线（U+005F LOW LINE 字符）的属性名称也保留用于实验目的，并保证永远不会正式添加到 HTML 语言中。

所以避免使用x-普通的属性名称。:)

于 2013-08-21T04:19:53.743 回答