Question

我创建了一个带有隔离范围的指令，并尝试使用＆＃39; @＆＃39;来分配值。符号。对于。例如指令看起来像这样。

xyz.js

<!-- language: lang-js -->

angular.directive('xyz', function($http, $timeout, $ocLazyLoad) {
   return {
       restrict: 'AE',
       templateUrl: 'urlPATH',
       scope: {
       name : '=',
       maxCount: "@"
       },
       link: function(scope, element, attributes) {
       scope.maxCount = scope.maxCount == undefined ? "1" : scope.maxCount;
       console.log(scope.maxCount) //Onload of the page it print 1 
       console.log(scope) // Onload it will print whole **scope** object with value of      **maxCount** is *undefined*.
       // The function which is call on keyup event defined in template.
       //For e.g.
       scope.getUrl = function(){
       console.log(scope.maxCount)
    }
}

template.html

<div style="display:block;">
      <form class="form-horizontal" role="form" style="margin-bottom:-8px;">
        <div class="form-group">
            <div class="col-sm-10">
                <div class="input-group input-group-sm lookup-drop dropdown ">
                    <input  type="text" class="form-control clearable " ng-model="xyz.name" ng-keyup="getUrl()" >
                </div>
               </div>
           </div>
     </div>

如果在 test.jsp 中使用指令，请执行以下操作：

<!-- language: lang-js -->
<xyz  name="test" max-count="10"></xyz>

然后在keyup事件控制台上看起来像这样。

10

如果在 test.jsp 中使用指令，请执行以下操作：

<!-- language: lang-js -->
<xyz  name="test" ></xyz>

然后在keyup事件控制台上看起来像这样。

undefined

我不知道为什么会这样。有什么我忘了，如果是的话请告诉我。在此先感谢!!

Answer 1

scope.maxCount绑定到您的属性，可以被认为是只读的。请尝试另一个变量：

scope.max = scope.maxCount || "1";
/* use scope.max instead of scope.maxCount */

或者，不是绑定到范围，而是从属性中读取：

scope.maxCount = attributes.maxCount || "1";

..并从范围映射中移除maxCount: "@"。

在指令中使用“@”时获取未定义的值

1 个答案: