angularjs - Angular 模型的依赖属性

标签 angularjs

在 Angular 中,一个关键特性是双向绑定(bind),它使模型始终保持最新。但是,我有一种情况,我拥有本质上是模型的依赖属性。我的问题是关于如何实现它。我可以在 View 中插入一个表达式来显示依赖于模型元素的计算,但我希望将该表达式分配为模型中的一个字段,这样其他表达式就可以使用该结果,所有内容都可以很好地更新。

一个简单的示例可能在模型中包含字段abc,其中c = a * b。可以将 {{a * b}} 放入 View 中,但我宁愿为 c 设置一个字段,以便我可以引用 c{{c}} 并在我需要显示它的 View 中使用 c 每当 a 或 < strong>b 已更新。

我猜你可以在 ab 上观察并重新计算 c,但看起来机器已经在 Angular 的某个地方了自动完成,因为它适用于 View 中的表达式。如果我提前不知道表达式(我不会),我需要解析 c 的表达式以提取变量并在所有变量上设置监视...对于 Angular,肯定有更好的方法。

可以做一些事情,比如将 Angular 表达式放入模型中吗?

我知道这里有一个危险 - 您可以创建一个自引用循环,但它会被检测到,从而可能引发错误。

最佳答案

Knockout 有 computableObservable 的概念,但 angular 没有这样不同的东西。但是,您可以执行以下操作。当 a 改变时,它会自动改变 c 的值。请看下面的代码片段。

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

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.a=5;
  $scope.b=10;
  $scope.c = function(){return $scope.a*$scope.b}
  $scope.changea = function(){$scope.a = 25}
});
<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.13/angular.js" data-semver="1.3.13"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    {{c()}}
    <input type="button" value="change a value to 25" ng-click="changea()" />
    a = {{a}}
  </body>

</html>

关于angularjs - Angular 模型的依赖属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28666766/

相关文章:

javascript - orderBy 没有按预期工作 : Angularjs

angularjs - 更新数组时如何避免刷新 ng-repeat DOM 列表

java - Spring 启动 Spring 安全AngularJS

javascript - 如何检查 Angular.js 应用程序中的 url 输入中是否包含 "http://"?

angularjs - 父 View 不反射(reflect)子 Controller 的更改

javascript - AngularJS $watch 没有更新我的输出

javascript - Angular 2路由器全局状态更改事件

angularjs - Angular和UI-Router,如何设置动态templateUrl

c# - 为 kendo ui Combobox 触发了两次更改事件

javascript - 如何以 M/d/yy 格式正确传递日期的 DatePicker 字符串表示形式