angularjs 表达式与ng-bind-白红宇

angularjs 表达式与ng-bind

阅读量：220 次

发布时间：2019-02-28

本文共 795 字，大约阅读时间需要 2 分钟。

AngularJS 表达式通常书写在双大括号内：{

{ expression }}。AngularJS 会在表达式书写的位置输出数据。

AngularJS 表达式类似于 JavaScript 表达式，可以包含文字、运算符和变量。例如：{

{ 5 + 5 }} 或 {

{ firstName + " " + lastName }}

ng-bind 指令用于将应用程序数据绑定到 HTML 视图。它会将应用程序变量绑定到某个段落的 innerHTML。

AngularJS 表达式可以直接将数据绑定到 HTML，这与 ng-bind 指令的功能有异曲同工之妙。

以下是一个使用 ng-bind 的示例：


     
    总价:

以下是一个使用 AngularJS 表达式的示例：


     
    总价: {
    
  { quantity * cost }}

使用 ng-bind 可以防止网络状态不佳时出现未被赋值的表达式。

小知识点：

执行 controller，设置各个作用域 scope（定义其内部作用域的行为）。

加载模板，形成 DOM 模板树。

执行 link，设置 DOM 各个行为。以下是一个 link 示例：

link: function (scope, element, attr, ctrl) {    element.bind("click", function () {        console.log("绑定点击事件");    });    element.append("增加段落块
");    // 不推荐在 link 中赋予 scope 行为    scope.hello = function () {        console.log("hello");    };}