ionic ng-model controller中取不到值（input）

于 2017-02-27 09:05:27 发布
阅读量2.3k 收藏 1
点赞数 1
CC 4.0 BY-SA版权
分类专栏： Apache Cordova 文章标签： ionic ng-model
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/u011127019/article/details/57911376
在使用Ionic开发过程中，遇到输入框input的ng-model在控制器中无法获取到改变值的问题。原因涉及$scope作用域及<ion-content>指令的影响。解决方法是通过对象方式绑定ng-model，如在controller定义对象data，在HTML中绑定ng-model='data.text1'，然后在控制器中通过$scope.data.text1获取值。初始化时需确保是对象类型。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

一、问题描述在使用ionic的时候，对于input绑定ng-model默认情况下载控制器中获取不到改变的值

1.在自定义控制器中获取不到改变的值

2.在页面绑定可以

原因：

1.ng-model取不到值是因为$scope作用域的问题

2.<ion-content>等指令也有自己的控制器，input的ng-model很有可能绑定到了指令的$scope上了

解决方案：

对于input的ng-model绑定使用对象object方式绑定，可以跨作用于访问。

了解本专栏 订阅专栏 解锁全文
博客
Cordova 插件合集_cordova-plugin合集
04-05 6039
1.0cordova-plugin-contacts 联系人，新增，联系人，拨打电话cordova plugin add cordova-plugin-contacts详细：cordova-plugin-contacts联系人操作_天马3798的博客-优快云博客_cordova 联系人1.cordova-plugin-themeablebrowsercordova plugin add cordova-plugin-themeablebrowser详细使用：cordova-p...
博客
C# 时间格式日期格式使用合集
06-24 198
本文整理C#常见日期处理技巧：(1)本地/UTC/GMT时间格式转换；(2)获取当天零点/周起始时间；(3)计算时间差与字符串转日期；(4)EF框架日期筛选问题及解决方案。附带易联云打印、Vant4+Vue3开发、.Net MQTT协议等扩展内容。涵盖日期操作核心场景，重点解决EF框架中DATEDIFF函数参数限制等典型问题。
博客
C# 易联云打印机对接教程
06-14 456
注意：获取的AccessToken无失效时间，若为自有应用，获取一次就可以了，其实就是把应用的AccessToken和打印机绑定了。易联云打印机，物联网打印机，58热敏打印，80热敏打印，小票打印机，扫码核销，语音播报。应用详情信息获取应用ID（client_id）& 应用密钥（client_secret）1、注册易联云账号+创建引用。2、采购打印进，扫码设备联网。3.创建应用绑定 设备。
博客
Vant4+Vue3+Vite开发搭建教程
05-24 436
本文介绍了Vue3项目的创建与Vant4组件库的集成步骤。首先通过npm create vue@latest命令创建Vue3项目，建议安装Vue Router、ESLint和Prettier。接着使用npm安装Vant4组件库，并在main.js中全局注册Vant组件和样式。最后介绍了开发调试(npm run dev)和项目构建(npm run build)的命令。文章还提到了Vant组件使用、Vue类与样式绑定以及表单输入双向绑定等内容。
博客
Vant 使用整理
05-19 583
有赞vant4的官方文档的服务器在国外，国内的有些网段打不开。可以尝试，清空浏览器缓存。或者查看其他使用文档。
博客
.Net Mqtt协议-MQTTNet（一）简介
05-10 1351
一、MQTTNet 简介MQTTnet 是一个高性能的MQTT类库，支持.NET Core和.NET Framework。
博客
MQTT协议介绍
05-10 956
MQTT（Message Queuing Telemetry Transport）是一种由IBM开发的轻量级消息传输协议，专为低带宽、高延迟或不可靠的网络环境设计，广泛应用于物联网（IoT）、智能家居和工业自动化等领域。MQTT采用发布/订阅模型，支持一对多通信，并提供三种服务质量级别（QoS0、QoS1、QoS2）以确保消息传递的可靠性。其轻量级特性使其特别适合嵌入式设备和网络带宽有限的场景。MQTT服务器作为发布-订阅架构的转发中心，支持多种编程语言和操作系统，如PHP、JAVA、Python、C、C#
博客
Nginx bash命令使用整理
04-17 329
当你遇到 Failed to restart nginx.service: Unit nginx.service not found 错误时，这意味着系统无法找到 Nginx 的服务单元文件。这通常是因为 Nginx 没有通过 systemd 管理，或者 Nginx 没有正确安装。首先，确保 Nginx 已经正确安装。1. 检查 Nginx 是否正确安装。
博客
Nginx Http配置整理
04-17 481
Nginx 支持 rewrite 功能。若您在编译时没有去掉 pcre，您可在 HTTP 的 server 中增加。由于版本问题，配置文件可能存在不同的写法。例如：Nginx 版本为。，即可将默认80端口的请求重定向为 HTTPS。未添加注释的配置语句，您按照下述配置即可。通过 Web 服务器实现跳转。在页面中添加 JS 脚本。在后端程序中添加重定向。
博客
微信小程序webview与小程序页面交互
04-08 1796
会自动铺满整个小程序页面，提供的接口返回小程序页面。2.小程序 web-view 页面参数接收。1.html 网页端代码编写。
博客
微信小程序开发前端培训课程
04-07 427
1.Box 盒子模型，列表布局（一行两列，一行多列）3.文字居中，块居中 ，水平方向，垂直方向。3、微信小程序的项目结构、创建、发布审核。1、微信小程序的概念、历史、发展。6、微信小程序的wxml基础语法。4、微信小程序开发常见问题整理。10、微信小程序的路由和导航。2.布局DIV+span。2、微信小程序的开发工具。5、微信小程序的框架接口。7、微信小程序的配置文件。8、微信小程序的布局组件。9、微信小程序的表单组件。2.单行文字，多行文字。1.HTML标签基础。6.CSS3动画基础。
博客
C#后端开发培训教程
04-07 374
1.Asp.Net Core项目基础创建，生命周期。3.Asp.Net Core接口访问、传参。4.Asp.Net Core接口测试、跨域。2.Element UI 搭建、基础使用。2.Asp.Net Core接口定义。C# Linq 数据源操作基础语法。1.Vue 基础使用、数据绑定。1.创建数据、备份还原数据库。4.班级、学生数据结构示例。3.Sql语句：增删改查。2.数据表：数据类型对应。C#基础语法、数据类型。C#数组、集合、类操作。5.数据库表：增删改查。4.数据库上下文操作。
博客
Vue 类与样式
03-29 519
将它们和动态的字符串绑定。但是，在处理比较复杂的绑定时，通过拼接生成字符串是麻烦且易出错的。数据绑定的一个常见需求场景是操纵元素的 CSS class 列表和内联样式。都是 attribute，我们可以和其他 attribute 一样使用。除了字符串外，表达式的值也可以是对象或数组。二、绑定内联样式，绑定style。用法提供了特殊的功能增强。
博客
Vue 表单输入绑定，双向绑定
03-22 650
如果该值无法被 parseFloat() 处理，那么将返回原始值。特别是当输入为空时 (例如用户清空输入字段之后)，会返回一个空字符串。如果你想要默认自动去除用户输入内容中两端的空格，你可以在。注意：要制定type=number html属性。如果你想让用户输入自动转换为数字，你可以在。还可以用于各种不同类型的输入，用户Vue 组件属性双向绑定。用于Vue 表单双向绑定。
博客
Vue生命周期_Vue生命周期钩子
03-15 480
每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤，比如设置好数据侦听，编译模板，挂载实例到 DOM，以及在数据改变时更新 DOM。在此过程中，它也会运行被称为生命周期钩子的函数，让开发者有机会在特定阶段运行自己的代码。注册一个回调函数，在组件挂载完成后执行。组件创建时候触发执行。
博客
Vue 概念、历史、发展和Vue简介
03-15 1563
当我们做了修改时，不会刷新页面，只是对组件本身进行立刻重载，不会影响整个应用当前的状态。2014年2月，尤雨溪在Hacker News、Echo JS与Reddit的R和JavaScript版块上均发布了Vue.js的最早版本，发布后的一天之内，Vue.js就登上了这3个网站的首页，之后Vue.js成为GitHub上最受欢迎的开源项目之一。——Vue.js 能够自动追踪依赖的模板表达式和计算属性，提供 MVVM 数据绑定和一个可组合的组件系统，具有简单、灵活的 API，使读者更加容易理解，能够更快上手。
博客
Asp.Net Core WebAPI开发教程（入门）
03-01 685
二、Asp.Net Core WebAPI 请求案例。
博客
Asp.Net Core MVC 中级开发教程
02-15 400
Asp.Net Core MVC 中级开发教程。二、Asp.Net Core 服务使用和封装。三、Asp.Net Core 中间件。
博客
vue2老版本 npm install 安装失败_安装卡主
02-13 911
特别说明：vue2老版本安装慢、运行慢，建议升级vue3+element plus+ vite。"core-js": "^3.6.5" 升级版本直接修改版本号。删除文件 package-lock.json。安装时间还是比较长，大约10分钟左右；第一步、修改npm 镜像为国内镜像。
博客
微信小程序如何隐藏分享功能_如何取消页面分享功能
12-28 933
在 onShareAppMessage 事件中监听转发按钮，或者自定义转发按钮的转发事件。转发可以配置转发是路径参数，可以自定义转发是图片内容。注意：这个事件，是在添加页面的时候，自动会生成的。解决方案：将此事件监听，从页面中删除就可以了。可以分享转发当前页面到群或者微信好友。右上角胶囊按钮》转发。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值