Question

我在使用角度上的孤立范围时几乎没有任何专业知识，但我找到了一个项目，我用它来检查用Angular指令的用户名的强度。

这是指令：

function usernameStrength() {
  return {
    require: 'ngModel',
    restrict: 'E',
    scope: {
      username: '=ngModel'
    },

    link: function(scope, elem, attrs, ctrl) {

      /** Watch password fields **/
      scope.$watch('username', function(newVal) {
        scope.strength = isSatisfied(newVal && newVal.length >= 8) +
          isSatisfied(newVal && /[A-z]/.test(newVal)) +
          isSatisfied(newVal && /(?=.*\W)/.test(newVal)) +
          isSatisfied(newVal && /\d/.test(newVal));

        function isSatisfied(criteria) {

          return criteria ? 1 : 0;

        }
      }, true);
  }
}

然后在我的HTML（JADE）上，我有一个输入和强制进度条显示和操作的指令。

input.form-control(autocomplete="off", type='text', required='', ng-model="register.username")

标签强度用户名强度（NG-模型= “register.username”）

直到这里一切正常，但是如果我在控制器上添加一个对象来存储表单中的所有数据（这是一个向导）并设置输入ng-model，就像这样ng-model="register.data.username"（ username-strength 指令上的相同内容）控制器中的数据此对象

vm.data  = {};

指令中的$ watch无法再访问输入。

Answer 1

使用您的代码，您将用户名强度放在标签上，而您的指令仅针对名称为“user-strength”的元素触发。这是错误的方式，所以$ watch不起作用。

ngModel绑定输入，选择，textarea，而不是标签。
您必须将restrict修改为'A'而不是'E'，并将其放入您的输入[text]

Fixed

您正在尝试跟踪文本字段用户名的状态，并打印类似标签上文本强度的内容。你可以从这个sample开始学习。（source）

孤立的范围问题

1 个答案: