ionic入门之数据绑定显示-1

简介: 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/71270393 [(ngModel)]是一个Angular语法,用于把hero.name绑定到输入框中。
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/71270393

[(ngModel)]是一个Angular语法,用于把hero.name绑定到输入框中。 它的数据流是双向的:从属性到输入框,并且从输入框回到属性。
如果将NgModel使用之后,程序崩溃了。 打开浏览器的控制台,如果看到:"ngModel ... isn't a known property of input."(ngModel不是input元素的已知属性)
虽然NgModel是一个有效的Angular指令,但它默认情况下是可用的。 它属于可选模块FormsModule。 如果不可用,那么我们必须在app.module.ts中引入FormsModule模块。



<ion-content padding>
  <div>
    <h1>{{title}}</h1>
    <h2>{{hero.name}} details!</h2>
    <div><label>id: </label>{{hero.id}}</div>
    <div>
      <label>name: </label>
      <input [(ngModel)]="hero.name" placeholder="name">
    </div>
  </div>
</ion-content>


import { Component } from '@angular/core';

export class Hero {
  id: number;
  name: string;
}

@Component({
  selector: 'page-about',
  templateUrl: 'about.html'
})

export class AboutPage {
  title = 'Tour of Heroes';
  hero: Hero = {
    id: 1,
    name: 'Windstorm'
  };  
}


相关文章
ionic入门之启动后会有短暂的白屏和黑屏
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.
1409 0
|
Web App开发 JavaScript 前端开发
Ionic 入门与实战之第二章第一节:Ionic 环境搭建之开发环境配置
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第二章第一节,主要对 Ionic 的开发环境配置做了简要的介绍,本文介绍的开发环境为 Mac 系统,Windows 系统基本类似,少许差别请查阅相关文档即可。
1226 0
|
JavaScript 前端开发 Android开发
Ionic 入门与实战之第一章:Ionic 介绍与相关学习资源
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第一章,主要对 Ionic 的概念、发展历程、适配的移动平台等知识进行了介绍,并分享了 Ionic 相关的学习资源。原文发表于我的技术博客 1. Ionic 简介 在前端技术发展越来越快的今天,Hybrid App 开发技术也受到了很大的影响。
1715 0
|
数据可视化
Ionic 入门与实战之第二章第二节:Ionic 环境搭建之 Ionic Lab 使用
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第二章第二节,主要对 Ionic Lab 工具作了介绍,并讲解了其使用方法,这也是一个开发 Ionic 比较好的调试工具。原文发表于我的技术博客Ionic Lab 是 Ionic 发布的一个可视化、跨平台的项目管理工具,可以创建、测试、编译、发布 Ionic 项目。
1262 0
ionic入门之服务开发模式
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/71330667 本章在ionic入门之多组件开发模式 基础上修改,创建服务用于多个view中调用,避免写重复的代码。
970 0
|
前端开发
ionic入门之深链接和延迟加载
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/71741941 主要模块 延迟加载听起来像是一个复杂的过程,但实际上是非常直截了当。
1403 0
|
前端开发 Python
ionic入门之数据绑定显示-2
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.
903 0
ionic入门之多组件开发模式
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/71276112 在实战中建议是用多组件开发模式,高耦合低内聚。
775 0
|
Android开发 JavaScript 开发工具
ionic入门之开始使用ionic框架
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/71120744 安装ionic npm install -g cordova ionic 首先,安装Node.js。
1331 0
|
JavaScript 前端开发 Android开发
Ionic 开发中遇到的常见问题及解决方案
Ionic 常见问题及解决方案
8375 0