当前位置: 首页 > 面试题库 >

使用Controller As方法访问继承的范围

岳泉
2023-03-14
问题内容

使用定义控制器的原始方法 ,访问父级的作用域非常简单,因为子级作用域原型继承自其父级。

app.controller("parentCtrl", function($scope){
   $scope.name = "Parent";
})
.controller("childCtrl", function($scope){
   $scope.childName = "child of " + $scope.name;
});

<div ng-controller="parentCtrl">
   {{name}}
   <div ng-controller="childCtrl">
      {{childName}}
   </div>
</div>

Controller-As方法 似乎是声明控制器的推荐方法。但是,对于Controller-A,上述方法不再有效。

当然,我可以通过pc.nameView 访问父作用域:

<div ng-controller="parentCtrl as pc">
   {{pc.name}}
   <div ng-controller="childCtrl as cc">
      {{cc.childName}}
   </div>
</div>

我确实有一些问题(意大利面条代码可能存在),但是这个问题是关于从子控制器访问父作用域的。

我看到此工作的唯一方法是:

app.controller("parentCtrl", function(){
   this.name = "parent";
})
.controller("childCtrl", function($scope){
   $scope.pc.name = "child of " + $scope.name;
   // or
   $scope.$parent.pc.name = "child of " + $scope.name;

   // there's no $scope.name
   // and no $scope.$parent.name
});

因此,现在,子控制器需要了解有关“ pc”的信息,但(在我看来)这仅限于视图。我认为子控制程序不应该知道视图决定声明一个的事实ng- controller="parentCtrl as pc"

问: 那么什么是正确的方法?

编辑:

澄清:我不是要继承父控制器。我希望继承/更改共享范围。因此,如果要修改第一个示例,则应该能够执行以下操作:

app.controller("parentCtrl", function($scope){
   $scope.someObj = {prop: "not set"};
})
.controller("childCtrl", function($scope){
   $scope.someObj.prop = "changed";
});

问题答案:

经过研究,我得出以下认识:

Controller-As方法不能代替使用$scope。两者都有其位置,可以/应该明智地一起使用。

  1. $scope确实执行该名称所隐含的含义:即,它在上定义了ViewModel属性$scope。这最适合与可使用$scope来驱动自己的逻辑或对其进行更改的嵌套控制器共享范围。
  2. Controler-As将整个控制器对象定义为具有命名范围的ViewModel(通过控制器的别名)。如果View决定是否要引用特定的控制器ViewModel,则此方法仅在View(而非其他控制器)中效果最佳。

这是一个例子:

var app = angular.module('myApp', []);



// Then the controllers could choose whether they want to modify the inherited scope or not:

app.controller("ParentCtrl", function($scope) {

    this.prop1 = {

      v: "prop1 from ParentCtrl"

    };

    $scope.prop1 = {

      v: "defined on the scope by ParentCtrl"

    };

  })

  .controller("Child1Ctrl", function($scope) {})

  .controller("Child2Ctrl", function($scope) {

    // here, I don't know about the "pc" alias

    this.myProp = $scope.prop1.v + ", and changed by Child2Ctrl";

  });


<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>



<body ng-app="myApp">

  <div ng-controller="ParentCtrl as pc">

     <div ng-controller="Child1Ctrl">

        <div>I know about the "pc" alias: {{pc.prop1.v}}</div>

     </div>

     <div ng-controller="Child2Ctrl as ch2">

       <div>I only care about my own ViewModel: {{ch2.myProp}}</div>

    </div>

  </div>


 类似资料:
  • 你好,我正在尝试创建一个类,它使用从学生类到研究生类的继承,但程序说它是不可访问的。 程序应该打印出一个初始化的GraduateStudent类变量,调用printStudent();

  • 我在我的程序中使用了实现继承,我的子类中的方法没有在主方法中被调用。它显示了错误“方法getArea()不在第二类型中定义”。getPerimeter()方法也有同样的问题。 我试过设置值和改变参数。 三角形。有关计算三角形面积的公式,请参见编程练习2.15。toString()方法的实现如下:return“Triangle:side1=“side1”side2=“side2”side3=“sid

  • 问题内容: 在父控制器作用域中,我已定义将其设置为“ x”。然后在子范围中,我使用ngModel 进行了定义: 加载页面后,会按预期正确设置为“ x”。当我选择“ y”时,在CtrlB中$ scope会按预期给出“ y”。 但是,当我检查的范围(使用AngularJS的batarang),它给“X”。 jsFiddle:http : //jsfiddle.net/sudhh/GGKjp/2/ 预览

  • 问题内容: 我是Angular的新手,所以我想按照教程学习,只是不懂而已。令我困惑的是点符号: 在任何输入框中键入一个值将更新所有其他输入框。因此,我认为这是控制器外部的第一个声明将输入元素值绑定到根作用域中的data.message模型。我不明白里面的绑定是如何从中读取值的。根作用域,为什么插入作用域内的值将显示在该作用域外的输入框中? 另外如果被删除 那个行为不见了,怎么会这样? 问题答案:

  • 本文向大家介绍C#继承方法,包括了C#继承方法的使用技巧和注意事项,需要的朋友参考一下 示例 有几种方法可以继承            

  • 发现了一个非常有趣的问题,在调试后找到了重现它的场景。 因此,如果我有一个具有包范围B的类,它有一些公共方法和扩展它的公共类A: 然后在测试中: 你猜怎么着,我得到了我刚刚抛出的NullPointerException,所以Mockito以某种方式创建了一个“真实”的对象,并调用了一个真正的方法,而不是一个被嘲笑的方法。为什么会这样? 在上面的示例中,我在类<code>B<code>中更改了<co