大佬教程收集整理的这篇文章主要介绍了angularjs – Angular-Meteor – 如何在基于包的设计中包含ng模板？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
什么是最好的方法？
更新2015-08-26 – 我想出了如何添加模板,如下所示.但是如何让Meteor包将模板的Angular控制器注入基础应用程序？
关键的搭配是Angular UI-router.
我有一个基本应用程序,其中包含名为packageprefix：packagename的包.在这个包中,我的代码位于包文件夹的根目录中：@H_810_13@myPackagedPage.ng.html – Angular HTML模板@H_810_13@myPackagedPage.js – 关联的Angular控制器
从我的主应用程序,我尝试创建一个到我的Angular模板的路由,如下所示：
angular.module('parentModule',[
'angular-meteor','ui.router','angularify.semantic.sidebar'
])
.config(['$urlRouterProvider','$stateProvider','$LOCATIOnProvider',function($urlRouterProvider,$stateProvider,$LOCATIOnProvider){
console.log("app.js config!");
$LOCATIOnProvider.html5Mode(true);
$stateProvider
.state('home',{
url: '/',templateUrl: 'client/views/home/home.ng.html',controller: 'HomeCtrl'
})
.state('myPackagedPage',{
url: '/myPackagedPage',templateUrl: 'packageprefix_packagename/myPackagedPage.ng.html',controller: 'MyPackagedPageCtrl'
})
;
$urlRouterProvider.otherwise('/');
}])
应用程序成功找到myPackagedPage.ng.html文件并呈现它.但是如何添加控制器？
console.log("myPackagedPage.js loaded");
angular.module('parentModule')
.controller('MyPackagedPageCtrl',['$scope',function($scopE){
console.log("MyPackagedPageCtrl");
}])
;
Argument 'MyPackagedPageCtrl' is not a function,got undefined
在我的package.js中,我有这个
Package.onUse(function(api) { api.versionsFrom('1.1.0.3'); api.use('angular:angular@1.4.4','client'); api.use("urigo:angular@0.9.3",'client'); api.use("session@1.1.0",'client'); //api.use('angularui:angular-ui-router@0.2.15','client'); api.addFiles('interests.js','client'); api.addFiles('interests.ng.html','client'); api.export("InterestsCtrl","client") });
请注意,您必须导出控制器,以便父应用程序可以访问它.
在我的包中,名为ramshackle：bigd-interest,我在根级别拥有这些文件：package.js,interests.ng.html和interests.js. interests.js将Angular控制器,Anguilar UI路由器路由注入模板,以及侧栏链接到父应用程序.它通过使用Meteor Session实现了这一点.我玩过其他方式,但Session是唯一有效的方法.请注意正确确定会话变量名称的范围.
//add controllers
var controllers = Session.get("BIGD.controllers");
if (!controllers) controllers = {};
var interestsCtrlSpec = "'$scope',InterestsCtrl";
InterestsCtrl = function($scopE){
console.log("InterestsCtrl running");
};
controllers.InterestsCtrl = interestsCtrlSpec;
Session.set("BIGD.controllers",controllers);
//add routes
var routes = Session.get("BIGD.routes");
if (!routes) routes = {};
routes.interests = {
url: '/interests',templateUrl: 'ramshackle_bigd-interests_interests.ng.html',controller: 'InterestsCtrl'
};
Session.set("BIGD.routes",routes);
//add sidebar links
//the key determines sorTing order
var sidebar = Session.get("BIGD.sidebar");
if (!sidebar) sidebar = {};
sidebar["interests"] = {
url: '/interests',controller: 'InterestsCtrl',rank: 5
};
Session.set("BIGD.sidebar",sidebar);
var interestsItem = {label: 'Interests',link: '/interests',icon: "rocket"};
在我的父应用程序的app.js中,我动态加载了会话中的控制器和路由,如下所示：
angular.module('bigdam','angularify.semantic.sidebar','nvd3','leaflet-directive','ui.router.history'
])
.config(['$urlRouterProvider',$LOCATIOnProvider){
//console.log("app.js config!");
$LOCATIOnProvider.html5Mode(true);
//add a static state
$stateProvider
.state('home',{
url: '/',controller: 'HomeCtrl'
});
//add the dynamic routes/states from other Meteor packages
for (var statEID in routes) {
var route = routes[statEID];
$stateProvider
.state(statEID,routE);
}
$urlRouterProvider.otherwise('/');
}])
;
//Declare the controllers from plugins
for (var controllerId in controllers) {
var controllerSpec = controllers[controllerId];
var controllerSpecArray = eval("[" + controllerSpec + "]")
angular.module('bigdam').controller(controllerId,controllerSpecArray);
}
以上是大佬教程为你收集整理的angularjs – Angular-Meteor – 如何在基于包的设计中包含ng模板？全部内容，希望文章能够帮你解决angularjs – Angular-Meteor – 如何在基于包的设计中包含ng模板？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。