`

AngularJS读取模板html页面中的数据

 
阅读更多

在angular的controller中, 如果想读取html页面中某个<input id="myid" ng-model="modelName" value="v"/>的value值时,用$scope.modelName是读取不到的,除非已经对$cope.modelName先赋值。但如果html中input已经有默认值,并且需要直接读取该值,那么,可以用以下的方法读取:

angular.element(document.querySelector('#myid')).val();

 这时,在controller里就可以得到input默认的value值了。

0
0
分享到:
评论

相关推荐

    angularjs实现动态表格

    在这个场景下,我们可以通过数组来存储表格的数据,然后在HTML模板中使用AngularJS的指令来动态生成表格的行(tr)和单元格(td)。 首先,我们需要在AngularJS应用中定义一个控制器(Controller),并在其中创建一...

    angularjs CURD Example

    这个"angularjs CURD Example"是一个示例项目,旨在教授如何在AngularJS中实现创建(Create)、读取(Read)、更新(Update)和删除(Delete)这四个基本的数据操作,也就是常说的CRUD操作。在Web应用开发中,CRUD...

    AngularJS开发技术指南

    AngularJS将应用开发中的常用概念抽象出来,比如将数据模型(data-model)关联到视图(UI)上,处理用户输入的写入、读取和验证,基于模型计算新的值,以及输出格式的本地化处理。这些概念简化了CRUD应用的开发流程,...

    Angularjs(增删改+分页+弹框+Sql数据库)

    1. **HTML模板文件**:包含AngularJS指令和数据绑定,用于构建用户界面。 2. **JS控制器文件**:定义AngularJS的控制器,负责处理用户交互和业务逻辑。 3. **服务文件**:可能包含自定义服务,用于与后端API通信,...

    AngularJS-SPA-Template-master.zip_Angularjs-master_angularjs_asp

    这个压缩包文件包含了一个基于AngularJS的单页应用程序(SPA)模板,特别地,它与ASP.NET MVC框架相结合,用于创建CRUD(创建、读取、更新和删除)操作的应用。AngularJS是Google维护的一个JavaScript框架,主要用于...

    某公司大数据展示模版(Html模板、大数据模板、大屏echarts模板).zip

    使用这样的模板,开发者需要了解如何将这些静态资源与服务器端数据源集成,例如通过Ajax获取实时数据,或者直接从数据库中读取。部署时,要考虑HTTP服务器配置、CDN使用以及安全性问题。 9. **定制化**: 虽然...

    程序员Html5页面简历模板源码

    2. **JavaScript框架**:许多Java开发者也会使用JavaScript库和框架,如AngularJS、React或Vue.js,这些可以在HTML5模板中进行示例展示。 3. **Ajax交互**:利用JavaScript和Java的异步通信,可以创建实时更新的...

    angular文件

    在上述示例中,`ng-app` 属性告知 AngularJS 处理整个 HTML 页面,而双大括号 `{{ }}` 用于数据绑定。在这个简单示例中,`{{ 'World' }}` 表示一个绑定到视图的字符串。 #### 六、结语 AngularJS 通过为开发者提供...

    使用多种技术的示例:SignalR、AngularJS、EntityFramework_JavaScript_下载.zip

    在本示例中,AngularJS可能被用来构建用户界面,实现数据的双向绑定和页面的动态更新。 **Entity Framework** Entity Framework是Microsoft的一个ORM(对象关系映射)框架,它允许开发者使用面向对象的编程方式来...

    前端项目-angular-qrcode.zip

    通过简单的配置,可以在页面上创建可交互的二维码,数据可以是JSON对象、字符串或者任何可以转化为字符串的值。 ### 4. 模块集成 要在AngularJS项目中使用`angular-qrcode`,首先需要将其库文件引入到项目中,通常...

    AngularJS Module方法详解

    AngularJS 不仅仅是一个JavaScript库,它提供了一整套解决方案,包括模板机制、数据绑定、模块、指令、依赖注入和路由等功能,旨在简化开发过程,使开发者能够更专注于业务逻辑,而不是DOM操作。 在AngularJS中,...

    atom-web-1.0d23.zip

    2. **src/html2js.js**:这是核心转换器的实现,它读取HTML模板文件,然后将其转换为JavaScript模块,模块内部使用`angular.module().run()`结构,将HTML字符串注入到AngularJS的模块中。 3. **lib**目录:包含了...

    通过AngularJS实现图片上传及缩略图展示示例

    它允许开发者使用HTML作为模板语言,通过增强HTML的属性来将数据绑定到对应的DOM上。接下来,我们将根据文章内容,来详细介绍如何使用AngularJS实现图片上传功能以及如何展示缩略图。 在文章中提到了HTML和JS两大...

    angular-1.2.23 官方包

    在1.2.23中,当加载模板时,如果已经存在于缓存中,会直接从缓存读取,避免了重复的HTTP请求。 ### 9. 对IE8的支持 尽管AngularJS 1.x系列支持IE8,但在1.3及以上版本中逐渐取消了支持。因此,如果你需要兼容IE8,`...

    AngularJs上传前预览图片的实例代码

    FileReader API允许我们读取本地文件,包括图片文件,而`FileReader`对象的`readAsDataURL`方法则可以将文件读取为数据URL,这样我们就可以在页面上通过`&lt;img&gt;`标签显示这个预览图片了。 以下是一个简单的AngularJS...

    employee-department-mvc:简单的CRUD员工部门管理演示了Spring Boot和AngularJS

    Spring MVC可能结合Thymeleaf或Freemarker等模板引擎,用于将后端数据渲染成HTML视图,供AngularJS展示。 9. **安全考虑**: 对于任何Web应用,安全都是重要的考虑因素。这个项目可能包含了Spring Security,用于...

    nodejs-mongodb-angularjs

    9. **模板引擎**:AngularJS使用自身的模板引擎来动态渲染视图,实现数据和视图的双向绑定。 10. **Ajax异步通信**:AngularJS的$http服务用于发起异步HTTP请求,获取或发送数据到服务器。 11. **前端路由**:...

    ASPNET-WebAPI-AngularJs-States:使用状态的AngularJs示例应用程序

    这可能包括定义不同页面、子页面,以及在导航过程中保持和传递数据。例如,可能有一个状态代表主页,另一个状态代表详情页,它们可能有不同的URL和视图模板。 项目结构可能如下: 1. `app.js`:这是主AngularJS...

Global site tag (gtag.js) - Google Analytics