Question

HTML code：

<ul  drag-drop  idProperty="today" >
  <li  draggable="true" ng-repeat="option in options track by $index" >
       {{option.plan_option_id}}
  </li>
</ul>

dragDrop是一个自定义指令：

module.directive('dragDrop',  function() {
  return {      
    scope: {
      idProperty:'@'
    },
     ...
  }
});

我希望idProperty只获取一个字符串值（例如星期二）而不连接到$ scope （例如$ scope.today ='Tuesday'）。无论如何要将HTML中的idProperty 直接与字符串值绑定？类似的东西：idProperty="'Tuesday'"

Answer 1

你非常接近。

你有这一行：

<ul  drag-drop  idProperty="today" >

应该是

<ul  drag-drop  id-property="today" >

Answer 2

您应该使用id-property="today"来完成这项工作。

要在不使用指令的scope的情况下获取它，您只需阅读指令的属性：

module.directive('dragDrop',  function() {
  return {
    link: function(scope, element, attrs) {
        var idProperty = attrs.idProperty;
    }
  }
});

Answer 3

可能看起来像这样

 <ul  drag-drop  id-property="today" >
 <li  draggable="true" ng-repeat="option in options track by $index" >
   {{option.plan_option_id}}
</li>

module.directive('dragDrop',  function() {
return {      
 scope: {
   idProperty:'@'
 },
 link: function(scope,elem, attrs, ctrl){
        var idProperty = null;
        attrs.$observe('idProperty', function(val){
           var idProperty = val
        })
  }
 }
});

Answer 4

当你在html中使用Directive时，必须像这样使用它

ngRepeat directive 
in html - > ng-repeat


your directive which you have made
idProperty
in html -> id-property

因为每个首都角色都应该替换为＆lt ;-( smallcharacter）＆gt; 所以使用

  <ul drag-drop id-property="today">

阅读本文档

https://docs.angularjs.org/guide/directive

将指令范围属性绑定到字符串

4 个答案: