通过ng-template进行角度布线
通过ng-template进行角度布线
提问于 2014-08-23 21:25:33
嗨，我做错了什么？我是angular js的新手，我正在使用ng-template来路由视图。
myApp.config(['$routeProvider','$locationProvider',function($routeProvider,$locationPro vider) {
$routeProvider.
when('/', {
templateUrl: 'add.html',
controller: 'myAppCtrl'
}).
when('/edit',{
templateUrl:'edit.html',
controller:'myAppCtrl'
}).
otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
}]);
}])但它不起作用。请帮帮我。
下面是我的html部分。
<body ng-controller="myAppCtrl">
<div ng-view>
<script type="text/ng-template" id="add.html">
<div>
<input type="text" ng-model="$storage.myname"/>
<input type="text" ng-model="$storage.myid"/>
<input type="number" ng-model="$storage.mynumber"/>
<button ng-click="submit();"> submit </button>
</div>
</script>
</div>回答 2
Stack Overflow用户
发布于 2014-08-23 21:55:59
你混淆了几件事：
- 您在body (
ng-controller="my AppController")中定义的控制器也被定义为路由的控制器。我怀疑你想要其中的一个，但不是两个都要。
，
- ，你的脚本标签包含模板，在它要替换的目录中(
<div ng-view>)。ng-view div应该为空(<div ng-view></div>)，并在其外部定义模板，可能是在标题中。
Stack Overflow用户
发布于 2014-08-23 22:36:12
我看了你的代码，找到了你的路由的解决方案这里是working fiddle Fiddle这里是代码
//html
<div ng-app="app">
<div ng-controller="MainCntl">
Choose:
<a href="/add">add</a> |
<a href="/edit">Edit</a> |
<div ng-view></div>
<hr />
<pre>$location.path() = {{$location.path()}}</pre>
</div>
<script type="text/ng-template" id="add.html">
Add
</script>
<script type="text/ng-template" id="edit.html">
Edit
</script>
</div>
//app.js
var myApp = angular.module('app', [], function($routeProvider, $locationProvider) {
$routeProvider
.when('/add', {
templateUrl: 'add.html',
controller: MainCntl
})
.when('/edit', {
templateUrl: 'edit.html',
controller: MainCntl,
});
// configure html5 to get links working on jsfiddle
$locationProvider.html5Mode(true);
});
function MainCntl($scope, $route, $routeParams, $location) {
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25462418
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号