ember_Study

emberJs的特性

绑定：双向绑定的变量值将相互影响和更新；

计算属性:将方法标识为属性，并自动随其所依赖属性变化而更新；

自动更新模板：无论底层数据何时更改，始终确保界面处于最新状态；

ember应用结构

控制器层：构建路由与控制器的结合逻辑

视图层：构建模板与视图的结合逻辑

ember 引入外部文件（ember-cli-build.js）

通过npm安装的文件，不需要引入，一般用npm安装的文件在package.json中

一般引入的文件是通过bower安装的依赖，使用bower安装的依赖在bower.json中（引入bower安装的文件路径：bower_components/文件）

引入外部文件需要进行环境变量的配置，在config/environment.js中进行配置

sendAction方法  和 send 方法的区别？

sendActio只存在Ember.Component类类，而send在send.route、send.controller、send.Component类中，

两者的第一个参数是action所对应的名字action（actionName）

sendAction中的方法名是Ember.Component类中所对应的根级的key,只有当这个key的值是一个function的时候才正常工作，否则报错

send（actoinName）参数则是在controller中actions:{}存在的actionName,若actions中没有这个名字，会报错

 以上是sendAction的使用

页面路由跳转

缺点：不更新路由
1、this.transitionTo('index')
2、this.transitionToRoute('index')

离开当前组件的钩子函数 routes/test.js
model:{}
actions:{
    will Transition：function(route){
        if(route.targetName !== 'test'){ 
            //执行逻辑
        }
    }
}

控制器文件初始化执行钩子函数controlles/test
actions外面
init:function(){
    Ember.run.scheduleOnce('afterRender',this,function(){
        //进入当前界面只执行一次
    })
}

使用其他界面控制器中的方法

testA:Ember.inject.controller('test');
使用：let test = this.get('testA');test.send('方法1')

使用outlet占位符

当前界面B.hbs
{{outlet 'test1'}}

routes/界面B.js
renderTemplate:function(){
    this.render('test/B')
    this.render('yy/test1',{
        into:'test/B',
        controller:'yy/test1',
        outlet:'test1'
    })
}
controller/界面B.js
C:Ember.inject.controller('test1')
C.send('...')

助手

数据转义convert-pri
import Ember from 'ember';

function priConvert([value,priArr]){

    if(priArr[value]){
        return priArr[value].text
    }
}
export default Ember.Helper.helper(priConvert)
使用
{{convert-pri record.risk priArr}}
参数介绍：
 priArr:computed('this',function(){
        return [{id:'0',text:'告警'},{id:'1',text:'警告'}]
 })
record.risk:string<一般接口返回> '0'||'1'

handbars语法

{{#if (eq ...)}}

{{else if (eq ...)}}

{{/if}}

//或者
{{#if (or (eq ..) (eq ..))}}

//并且
{{#if (and (not-eq ..) (not-eq ..))}}

Math.pow(1024,2)