##开发系统ui
* 系统ui模板
~~~
js部分：
~~~
~~~
(function () {
'use strict';
angular.module('System').directive("sysUi指令名", [function(){
return {
replace:true,
scope:{
sync:"=",
on:"=",
trigger:"="
},
templateUrl:'SysUi/Template/sysUi指令名.html',
link : function(scope, element, attrs) {
},
controller:["$rootScope","$scope",function ($rootScope,$scope) {
//数据双向绑定
$scope.data = $scope.sync;
$scope.click = function ( obj ) {
//调用控制器方法
$scope.trigger('myclick','ui调用控制器方法');
};
//绑定事件提供控制器调用
$scope.on('uiclick',function ( arg ) {
alert("ui绑定的事件"+arg);
});
}]
};
}]);
})();
~~~
模板视图部分
~~~
<div style="background: #f0ad4e">
<h1>ui部分</h1>
<hr>
<p>数据双向测试：<input ng-model="title"></p>
<button ng-click=”click()”>点击我调用页面控制器方法</button>
</div>
~~~
* 页面控制器调用ui指令
~~~
js部分
~~~
~~~
//ui数据绑定
wjSystem.sysUi({
mydemo:{
sync:{
title:"标题"
},
on:{
myclick:function ( str ) {
alert("页面控制器方法myclick:"+str);
}
}
}
});
//调用ui方法
$scope.click = function () {
//调用ui方法（下面两种是等效的，个人习惯爱用哪种都可以）
wjSystem.sysUi('mydemo').trigger('uiclick', "控制器调用ui" ); //调用ui方法
wjSystem.sysUi("mydemo.uickick")("控制器调用ui,点调用写法"); //点调用ui方法
};
~~~
~~~
模板视图部分
~~~
~~~
<div style="background: #bbbbbb">
<h1>控制器部分</h1>
<hr>
<p>数据双向测试：<input ng-model="mydemo.title"></p>
<button ng-click="click()">点击我调用ui页面方法</button>
</div>
<br />
<sys-ui data="mydemo" name="demo"></sys-ui>
~~~
