修改：以下是Plunker的完整代码。虽然我不能执行任何事情但是在本地工作的代码相同。但是会出现控制台错误
这一切都很完美。但是由于:id中的/news/:id/，我在控制台中遇到jquery / angular错误，无法在我的代码中的任何位置跟踪
我不能c我做错了什么。
答案 0 :(得分：2)
首先，您尝试使用ui-router，但是您的plunker中包含ngRoute脚本。将其更改为
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"></script>
然后一切都应该正常工作！
我建议你做一些改变......
<强> 1。使用ui-sref代替href ，因为定义
ui-sref="post({id:1})"变为href="#/news/1"
如果您想在某一天更改网址，则必须更改路由文件，而不是每个href。
$stateProvider
.state('post', {
url: "news/:id"
或
$stateProvider
.state('post', {
url: "archive/:id"
或
$stateProvider
.state('post', {
url: "whatever/:id"
<强> 2。使用抽象状态
在您的示例中，更好地定义包含标题，内容和页脚的抽象状态 - 这是一个典型的用例。
<强> UI-路由器 抽象国家
抽象状态可以具有子状态但无法激活 本身。 “抽象”状态只是一种不可能的状态 过渡到。当其中一个时，它会被隐式激活 后代被激活。
有关如何使用抽象状态的一些示例如下：
为所有子状态网址添加网址。要插入模板 它自己的ui-view（s）是它的孩子所居住的。可选 将控制器分配给模板。控制器必须配对 模板。另外，将$ scope对象继承到子级，只是 了解这是通过视图层次结构而不是状态发生的 层次结构。通过解决方案提供已解决的依赖关系以供使用 儿童国家。通过数据提供继承的自定义数据 儿童状态或事件监听者。运行onEnter或onExit 可能会以某种方式修改应用程序的功能。任何组合 上面提到的。记住：抽象状态仍然需要自己的状态 为他们的孩子插入。所以，如果你正在使用 抽象状态只是为了添加一个url，设置resolve / data或运行一个 onEnter / Exit功能，那么你还需要设置模板： “”。
这是一个plunker，显示了我将如何做到这一点。
https://plnkr.co/edit/5FvJaelyxdl5MuALt5VY?p=preview
希望它有所帮助。
答案 1 :(得分：1)
您可以使用以下语法来使用多个视图
header我猜您要保留footer和content并更改.state('main',{
abstract: true,
views: {
'header': ... ,
'content': {
template: '<ui-view></ui-view>',
}
'footer': ...
}
})
次观看。
您可以通过将此状态设置为所有其他状态的父级来实现此目的
假设
main.child然后所有的子视图都会加载他们的视图，
例如：在<ui-view></ui-view>等中，您的模板将加载到内容的user_rew标记
答案 2 :(得分：0)
如果您需要根据关键字使用自定义模板，则可以执行以下操作：
.config(['$routeProvider',
function($routeProvider, $routeParams) {
$routeProvider
.when('/news/:id/:keyWords', {
template: '<div ng-include="url"></div>',
controller: "exampleController"
})
然后在exampleController
中 function($routeParams, $scope) {
$scope.url = $routeParams.keyWords;
}