Question

我在页脚上有一个下一个和上一个按钮，位于index.html文件上。我的代码结构如下 -

<html ng-app="myapp">
<body ng-controller="myController">
<div id="header">Header</div>
<div id="content"><ng-view></ng-view></div>
<div id="footer">
   <button type="button" id="next" ng-click="nextPage()">Next</button>
   <button type="button" id="prev" ng-click="prevPage()">Previous</button>
</div>
</body>
</html>

单击“下一个”和“上一个”按钮，我的页面内容应重定向到内容中的新视图。我使用ui-view重定向到不同的视图。但在控制器部分，它只重定向到1.html页面。再次点击它后，它不会重定向到2.html页面

我需要在点击每个下一个按钮时重定向到不同的页面（1.html，2.html，3.html，4.html）。请让我知道它是如何可能的。

Answer 1

您可以使用角度$location来完成。

<html ng-app="myapp">
<body ng-controller="myController">
<div id="header">Header</div>
<div id="content"><ng-view></ng-view></div>
<div id="footer">
   <button type="button" id="next" ng-click="go('/NextPageUrl')">Next</button>
   <button type="button" id="prev" ng-click="go('/PrevPageUrl')">Previous</button>
</div>
</body>
</html>

在控制器中：

$scope.go = function ( path ) {
  $location.path( path );
};

Answer 2

您的代码也存在问题。由于您使用的是ui.router，因此需要使用$stateProvider指令与$state和ui-view进行任何互动，但您已使用ng-view，因此您的代码也是如此不行。将其更改如下：

<html ng-app="myapp">
<body ng-controller="myController">
  <div id="header">Header</div>
  <div id="content">
    <ui-view></ui-view>
  </div>
  <div id="footer">
    <button type="button" id="next" ng-click="nextPage()">Next</button>
    <button type="button" id="prev" ng-click="prevPage()">Previous</button>
  </div>
</body>
</html>

如何通过angularjs中的下一个和上一个按钮重定向到多个视图

2 个答案: