Javascript AngularJS:查看范围中的变量

Javascript AngularJS:查看范围中的变量,javascript,angularjs,Javascript,Angularjs,我尝试在sane视图上制作一些编辑表单,我使用repeater渲染它们,数据正在更新ok,唯一的问题是在数据更新后隐藏编辑表单 我的看法是: <div style="margin-left: 5px; border-top: 1px solid #eee; margin-bottom:5px;" data-ng-repeat="name in person.master_data.alternative_names"> <div id='ed

我尝试在sane视图上制作一些编辑表单,我使用repeater渲染它们,数据正在更新ok,唯一的问题是在数据更新后隐藏编辑表单

我的看法是:

        <div style="margin-left: 5px; border-top: 1px solid #eee; margin-bottom:5px;" data-ng-repeat="name in person.master_data.alternative_names"> 

        <div id='editor-primary_name' class="editor span6">
          <button id="edit-primary_name" type="button" class="btn btn-mini btn-toggle" data-ng-click="edit_alt_name{{$index}} = true">
          <i class="icon-pencil"></i>
        </button>

        <div data-ng-show="!edit_alt_name{{$index}}">
        <div class="span2 control-label"><p>First Name(s):</p></div>
        <div class="span3 break-word"><strong id="preview_pers_first_name">{{name.first_name}}</strong></div>
        <div class="clearfix"></div>

        <div id="preview_pers_last_name">
          <div class="span2 control-label"><p>Last Name:</p></div>
          <div class="span3 break-word"><strong>{{name.last_name}}</strong></div>
          <div class="clearfix"></div>
        </div>

        <div id="preview_pers_full_name">
          <div class="span2 control-label"><p>Full Name/ Presentation:</p></div>
          <div class="span3 break-word"><strong>{{name.presentation_name}}</strong></div>
          <div class="clearfix"></div>
        </div>

        <div id="preview_pers_full_name">
          <div class="span2 control-label"><p>Name Type:</p></div>
          <div class="span3 break-word"><strong>{{name.type}}</strong></div>
          <div class="clearfix"></div>
        </div>

        <div id="preview_pers_full_name">
          <div class="span2 control-label"><p>SUISA IPI Number:</p></div>
          <div class="span3 break-word"><strong>{{name.suisa_ipi_number}}</strong></div>
          <div class="clearfix"></div>
        </div>
      </div>
    <div class="clearfix"></div>

    <div class="FORM" data-ng-show="edit_alt_name{{$index}}">
        <form class="form-horizontal" data-ng-submit="submit_primary_name({{$index}})" >
          <fieldset id="fieldset1">
              <div class="row control-group">
                  <div class="span2 control-label"><p>First Name(s):</p></div>
                  <div class="span3 break-word"><input type="text" id="first_name" data-ng-model="name.first_name" data-ng-disabled="form_disabled"/></div>
                  <div class="clearfix"></div>
              </div>


              <div id="preview_pers_last_name" class="row control-group">
                <div class="span2 control-label"><p>Last Name:</p></div>
                <div class="span3 break-word"><input type="text" id="last_name" data-ng-model="name.last_name" data-ng-disabled="form_disabled"/></div>
                <div class="clearfix"></div>
              </div>

              <div id="preview_pers_full_name" class="row control-group">
                <div class="span2 control-label"><p>Full Name/ Presentation:</p></div>
                <div class="span3 break-word"><input type="text" id="presentation_name" data-ng-model="name.presentation_name" data-ng-disabled="form_disabled"/></div>
                <div class="clearfix"></div>
              </div>

              <div id="preview_pers_suisa_number" class="row control-group" data-ng-if="person.master_data.roles">
                <div class="span2 control-label"><p>SUISA IPI Number:</p></div>
                <div class="span3 break-word"><input type="text" id="suisa_ipi" data-ng-model="name.suisa_ipi_number" data-ng-disabled="form_disabled"/></div>
                <div class="clearfix"></div>
              </div>

              <div class="row control-group">
                <button type="submit" class="btn btn-success">Submit</button>
                <button type="button" class="btn btn-danger" data-ng-click="edit_alt_name{{$index}} = false" >Cancel</button>
              </div>
          </fieldset>
        </form>
      </div>
    </div>


问题是,我动态创建的变量(如edit_alt_name_index)不在范围内,我无法从控制器访问它们,因为它们在控制器中未定义。是否有从控制器访问它们的方法

我认为是Angulars脏检查失败了,因为eval在全局范围内被调用(我认为)。试试这个:

// replace this:
eval("$scope.edit_alt_name" + $scope.alt_name_id + "=false;");
// with
$scope['edit_alt_name' + $scope.alt_name_id] = false;
哦,是的,别忘了
eval
是邪恶的():)

下面是一个例子:


“表单2”不会隐藏,因为它使用eval。

请检查您是否正确使用了函数。您应该注意这些事情

注册在watchExpression更改时执行的侦听器回调

每次调用$digest()时都会调用watchExpression,并应返回将被监视的值。(由于$digest()检测到更改时会重新运行,因此watchExpression可以在每个$digest()执行多次,并且应该是幂等的

仅当当前watchExpression和上一次调用watchExpression的值不相等时才会调用侦听器(初始运行除外,请参见下文)。不等式是根据angular.equals函数确定的。为了保存对象的值以供以后比较,使用angular.copy函数。这还意味着观看复杂选项会对内存和性能产生不利影响

监视侦听器可能会更改模型,这可能会触发其他侦听器启动。这是通过重新运行监视程序直到检测不到任何更改来实现的。重新运行迭代限制为10,以防止无限循环死锁


如果希望在调用$digest时收到通知,则可以注册一个不带侦听器的watchExpression函数。(因为在检测到更改时,watchExpression可以在每个$digest周期执行多次,所以请准备好多次调用您的侦听器。)

不起作用,问题是edit_alt_name_索引似乎不在范围内,因为在视图中“已定义”而不是在控制器中,我可以在我的控制器中定义edit_alt_name_0,edit_alt_name_1…因为我不知道数组中有多少个值您可以始终使用$scope.$parent如果变量在上述范围内声明。
// replace this:
eval("$scope.edit_alt_name" + $scope.alt_name_id + "=false;");
// with
$scope['edit_alt_name' + $scope.alt_name_id] = false;