模板和数据的基本操作过程如下:

用户请求应用程序开始页

用户的浏览器发起一个HTTP连接到服务器,然后加载index.html页面,其中包含模板

角被加载到页面中,等待加载页面,并寻找NG应用程序指令来定义模板的边界。

角遍历模板,找到指定的绑定关系,触发一些列操作:注册侦听器,执行一些DOM操作,从服务器获取初始化数据。最后,应用程序将启动并将模板转换成DOM视图。

连接到服务器以加载要显示给用户的其他数据。



显示文本



一个{ } }窗体,如{第二名

使用第一个,未呈现的页面可以被用户看到,索引页面推荐使用第二个页面,而页面的其余部分可以使用第一个页面。

表格输入

复制代码代码如下所示:





形式





功能startupcontroller(范围){

scope.funding美元= { 0 } startingestimate;

computeneeded =函数(){

scope.funding.needed = $ 10美元scope.funding.startingestimate;

};

范围表('funding美元。美元。startingestimate ',computeneeded / /);在观看模式的变化

}









启动时调用函数: /更改

建议:{所需资金} }









在某些情况下,我们不希望在我们有变化时立即采取行动,而是等待:

复制代码代码如下所示:





形式





功能startupcontroller(范围){

scope.funding美元= { 0 } startingestimate;

computeneeded =函数(){

scope.funding.needed = $ 10美元scope.funding.startingestimate;

};

范围表('funding美元。美元。startingestimate ',computeneeded) / /看监视器;一种表达,这种表达的变化时,它调用一个回调函数。

scope.requestfunding美元=函数(){

Window.alert(对不起,请让更多的客户第一。)

};

}







提交

启动:

建议:{所需资金} }

资助我的创业!









非表单提交类型交互,以单击为例

复制代码代码如下所示:





形式





功能startupcontroller(范围){

scope.funding美元= { 0 } startingestimate;

computeneeded =函数(){

scope.funding.needed = $ 10美元scope.funding.startingestimate;

};

范围表('funding美元。美元。startingestimate ',computeneeded);

scope.requestfunding美元=函数(){

Window.alert(对不起,请让更多的客户第一。)

};

scope.reset美元=函数(){

scope.funding.startingestimate = 0美元;

};

}









启动:

建议:{所需资金} }

资助我的创业!

复位









列表、表和其他迭代元素

NG重复返回,目前通过美元的例子代码元素指标序列号如下:

复制代码代码如下所示:





形式





学生= { { var名称:玛丽,得分:10 },{姓名:'jerry,得分:20 },{姓名:杰克,得分:30 } }

功能studentlistcontroller(范围){

scope.students美元=学生;

}











{ {索引} + 1 } }

{学生名称}

{学生}











隐藏和显示

NG显示和NG隐藏函数是等价的,但效果正好相反。

复制代码代码如下所示:









功能deathraymenucontroller(范围){

scope.menustate美元= {显示:假}; / /这里menustate.show = FALSE不显示效果。在变量声明或{ }。

scope.togglemenu美元=函数(){

scope.menustate.show美元=!scope.menustate.show美元;

};

}









切换菜单



打昏

瓦解

从历史中抹去











CSS类和样式

NG类和NG样式都可以接受表达式,表达式的结果可能是下列值之一:

表示CSS类名的字符串,由空格分隔。

类名称数组

CSS类名到布尔值的映射

代码示例如下所示:

复制代码代码如下所示:







{。错误

背景颜色:红色;

}

{。警告

背景颜色:黄色;

}







功能headercontroller(范围){

scope.iserror美元= false;

scope.iswarning美元= false;

scope.showerror美元=函数(){

scope.messagetext美元= 的错误!!!!

scope.iserror美元=真;

scope.iswarning美元= false;

}

scope.showwarning美元=函数(){

scope.messagetext美元=警告!!!

scope.iswarning美元=真;

scope.iserror美元=真;

}

}









{ { messageText } }

误差

警告









CSS类名到布尔值的映射

示例代码如下所示:

复制代码代码如下所示:







{。选择

背景颜色:浅绿色;

}







功能餐厅($范围){

scope.list美元= { {姓名:帅

scope.selectrestaurant美元=功能(行){

scope.selectedrow美元=行;

}

}









/ / CSS类命名为布尔值的地图,当模型属性的值等于selectedrow美元指数在NG的重复,选定的样式设置为线

{餐厅名称}

{餐厅烹饪}