1. 首页
  2. 问题
  3. 在ng-view外部绑定Angularjs数据
一尘不染

在ng-view外部绑定Angularjs数据

angularjs

我对所有页面都有一个通用模板，其中包含一个菜单栏，它位于ng-view.bar的外面。我位于其中一个页面的内部，ng-view我想将输入数据绑定到此模板区域（该区域位于与输入页面不同的控制器下） ）。我的意思是当我输入名称时，该名称将出现在模板区域。可以吗？这是the
****

<body ng-app="sampleApp">

  <div class="container"> 
    <div class="row">
        name is :{{name}}<br/>
  username is :{{uname}}
      <div class="col-md-3">
        <ul class="nav">
          <li><a href="#name"> Add name </a></li>
          <li><a href="#uname"> add username </a></li>
        </ul>
      </div>
      <div class="col-md-9">
        <div ng-view></div>
      </div>
    </div>
  </div>

  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
  <script src="app.js"></script>

</body>

阅读 174

收藏
2020-07-04

共1个答案

一尘不染

通过遵循始终具有“’
”的“最佳实践”，可以很容易地避免使用基元出现此问题。在您的ng模型中
-观看3分钟值得。Misko演示了ng-switch的原始绑定问题。

有一个 ‘。’ 在您的模型中，将确保原型继承在起作用。所以用

<input type="text" ng-model="someObj.prop1"> rather than
<input type="text" ng-model="prop1">.

— AngularJS Wiki-
范围原型/原型继承的细微差别是什么？

PLNKR上的演示

$scope.obj 像$rootScope变量一样工作。它是用于原型继承吗？

作用域以模仿应用程序DOM结构的层次结构排列。每个AngularJS应用程序都只有一个根范围，但可以具有任意数量的子范围。

ng-app-> $ rootScope
 |-ng-controller-> $ scope（容器）
    |-ng-view-> $ scope（视图）

通过使用：视图控制器中<input ng-model="obj.name" />的ng-model指令使用原型继承$scope.obj从视图外部查找。然后，它可以获取并设置该name对象的属性。

有关更多信息，请参见《AngularJS开发人员指南-范围层次结构》

$rootScope 存在，但可以用于邪恶

AngularJS中的作用域形成一个层次结构，典型地继承自树顶部的根作用域。通常这可以忽略不计，因为大多数视图都有自己的控制器，因此也有自己的作用域。

有时，有些数据要对整个应用程序进行全局处理。对于这些，您可以$rootScope像其他作用域一样在其上注入并设置值。由于作用域是从根作用域继承而来的，因此这些值将可用于附加到指令的表达式，就像ng- showlocal上的值一样$scope。

当然，全局状态很糟糕，您应该$rootScope谨慎使用，就像（希望）使用任何语言的全局变量一样。特别是，不要将其用于代码，而仅用于数据。如果您想将函数放在上$rootScope，最好将它放在可以在需要的地方注入并且更容易测试的服务中。

相反，请勿创建仅在生命中唯一目的是存储和返回数据位的服务。

-AngularJS常见问题解答-
$rootScope存在，但可用于邪恶

2020-07-04