angular1.x 组件开发
搜索框组件开发:
1.注册组件
app.js
angular.module("myApp",[])
.component("nameSearch",{
templateUrl:"../components/nameSearch.html",
template: "",
controller:function ($scope,$rootScope) {
// 搜索框内容
$scope.searchContent = '';
// 点击搜索操作
$scope.query = function(val) {
// 广播
$rootScope.$broadcast("searchContent.updated", val);
}
}
});
2.创建组件
components/nameSearch.html
<!-- 姓名模糊查询组件(搜索框) -->
<div class="bar bar-header item-input-inset">
<label class="item-input-wrapper">
<i class="icon ion-ios-search placeholder-icon"></i>
<input ng-model="searchContent" type="search" placeholder="请输入矫正人员姓名">
</label>
<button ng-click="query(searchContent)" class="button button-positive">搜索</button>
</div> <style>
.item-input-inset{
/**/
}
</style>
3.父页面调用
templates/tab-alarm.html
<ion-view hide-nav-bar="true">
<ion-content>
<!-- 搜索框 -->
<name-search></name-search>
</ion-content>
</ion-view>
4.父页面接收 组件传参
.controller('AlarmCtrl', ['$scope',function($scope) {
/**
* 获取搜索框内容
*/
$scope.$on("searchContent.updated", function(event, data){
console.log(data);
});
}])
5.效果图
angular1.x 组件开发的更多相关文章
- React-Native 组件开发方法
前言 React Native的开发思路是通过组合各种组件来组织整个App,在大部分情况下通过组合View.Image等几个基础的组件,可以非常方便的实现各种复杂的跨平台组件,不过在需要原生功能支持. ...
- 饿了么基于Vue2.0的通用组件开发之路(分享会记录)
Element:一套通用组件库的开发之路 Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库.今天我们要分享的就是开发 Element 的一些心得. 官网 ...
- 基于vue的新组件开发
前天完成了一个新组件的开发,做的过程也是各种遇到问题,彻底弄懂了slot,巩固了一些flex布局和jquery的知识,比起自己第一次做组件开发,现在已经是能够下手做,遇到问题解决问题,还算有进步. 但 ...
- winRT Com组件开发流程总结
winRT Com组件开发: 1.编辑idl文件,winRT COM的idl文件与win32的idl文件有差异,如下: interface ItestWinRTClass; runtimeclass ...
- [js开源组件开发]localStorage-cache本地存储的缓存管理
localStorage-cache本地存储的缓存管理 距离上次的组件开发有近三个月的时间了,最近一直在做一些杂事,无法静下心来写写代码,也是在学习emberjs,在emberjs中有一个很重要的东西 ...
- 【2015上半年总结】js开源组件开发系列索引
js开源组件开发系列一索引 2015.8 by 田想兵 个人网站 从3月份进入新公司以来,时经五个月,我以平均每周1个小组件的速度,已经完成的js组件有22个之余了,已基本上全部用到实际项目中,这些小 ...
- [js开源组件开发]network异步请求ajax的扩展
network异步请求ajax的扩展 在日常的应用中,你可能直接调用$.ajax是会有些问题的,比如说用户的重复点击,比如说我只希望它成功提交一次后就不能再提交,比如说我希望有个正在提交的loadin ...
- [js开源组件开发]数字或金额千分位格式化组件
数字或金额千分位格式化组件 这次距离上一个组件<[js开源组件开发]table表格组件>时隔了一个月,由于最近的项目比较坑,刚挖完坑,所以来总结性提出来几个组件弥补这次的空缺,首先是金额和 ...
- [js开源组件开发]query组件,获取url参数和form表单json格式
query组件,获取url参数和form表单json格式 距离上次的组件[js开源组件开发]ajax分页组件一转眼过去了近二十天,或许我一周一组件的承诺有了质疑声,但其实我一直在做,只是没人看到……, ...
随机推荐
- Beautiful Soup 4.2.0 doc_tag、Name、Attributes、多值属性
找到了bs4的中文文档,对昨天爬虫程序里所涉及的bs4库进行学习.这篇代码涉及到tag.Name.Attributes以及多值属性. ''' 对象的种类 Beautiful Soup将复杂HTML文档 ...
- python爬虫入门七:pymysql库
我们使用python爬取得到的数据,有时候会数据量特别大,需要存入数据库. 需要注意的是,MySQL是一种关系型数据库管理系统,利用MySQL可以对数据库进行操作,而MySQL并不是一个数据库. 而p ...
- 阀值化 threshold
OpenCV中的阈值(threshold)函数: threshold 的运用. C++: double threshold(InputArray src, OutputArray dst, doubl ...
- HAL——学习SysTick
开始: 1.嵌套向量中断寄存器 (NVIC): 嵌套向量中断控制器 (NVIC) 和处理器内核接口紧密配合,可以实现低延迟的中断处理和晚到中断的高效处理.包括内核异常在内的所有中断均通过 NVIC 进 ...
- PAT Basic 1041
1041 考试座位号 每个 PAT 考生在参加考试时都会被分配两个座位号,一个是试机座位,一个是考试座位.正常情况下,考生在入场时先得到试机座位号码,入座进入试机状态后,系统会显示该考生的考试座位号码 ...
- python基础学习笔记——文件操作
文件操作 初始文件操作 使用Python来读写文件是非常简单的操作,我们使用open()函数来打开一个文件,获取到文件句柄,然后通过文件句柄就可以进行各种各样的操作了 根据打开方式的不同能够执行的操作 ...
- git 的右键快捷菜单恢复
最近装了个vs 2017 的社区版的,发现之前安装的git的右键快捷方式不见了,因此在此写备注,只要是git的安装位置是默认位置的,也可以使用此注册表恢复,其他路径请自行修改reg文件 主要是针对gi ...
- Java-确定字符串是否包含子字符串
利用String自带的函数和正则来实现 package com.tj; public class MyClass implements Cloneable { public static void m ...
- python3将unicode转化成中文输出
a = [] with open('douban.json','r') as f: for i in f.readlines(): a.append((i.encode('utf8').decode( ...
- Centos7 安装配置优化mysql(mariadb分支)
1.说明 由于在centos7的yum仓库中没有mysql,centos7用mariadb替代了mysql. mariadb是mysql源代码的一个分支, mysql被ORACLE闭源,而mariad ...