Angularjs - 更改模板而不更改网址

新的Angular和JS，所以我的行话可能会关闭。Angularjs - 更改模板而不更改网址

在页内我想根据用户不同的模板加载的某个片段点击没有改变URL路径。我知道如何使用$ routeProvider和ng-view，但需要更改URL以加载相关模板。

我还想在此特定部分中添加一个反向链接，以便用户可以返回一个步骤。

任何想法？我找不到类似于我的任何问题，但我可能正在用不正确的术语搜索。任何帮助或建议非常感谢。

Regards

来源

2014-09-11 Brad Walker

没有ü检查'NG-include'？ – 2014-09-11 11:02:57

@KalhanoToressPamuditha我没有，但看起来像解决方案。谢谢。 – 2014-09-12 07:55:47

我建议使用ng-include。这使您可以从其他位置包含大量的html代码。然后你可以使用ng-show/hide来显示想要的图片或者ng - 如果你不想要它，如果不需要的话，它可能会被忽略

来源

2014-09-11 11:10:01 Cathal

这正是我要找的，非常感谢！ – 2014-09-12 07:56:34

而对于后退按钮，你将不得不保留历史记录数组与过去的点击/链接，并按下弹出，当你点击并点击返回。 “完整” 的解决方案将类似于：

的index.html

<html ng-app="app"> 
... 
<div ng-controller="myController"> 

    <button ng-click="setCurrentView('tem1')">Template 1</button> 
    <button ng-click="setCurrentView('tem2')">Template 2</button> 
    <button ng-click="setCurrentView('tem3')">Template 3</button> 

    <div ng-include="tem1.html" ng-show="currentView==tem1"></div> 
    <div ng-include="tem2.html" ng-show="currentView==tem2"></div> 
    <div ng-include="tem3.html" ng-show="currentView==tem3"></div> 

    <button ng-click="goBack()">Back</button> 

</div> 
... 
</html>

app.js

angular.module('app',[]).controller('myController',['$scope',function($scope){ 
    $scope.currentView='tem1'; 
    var history=[]; 

    $scope.setCurrentView=function(view){ 
    history.push($scope.currentView);   
    $scope.currentView=view; 
    } 

    $scope.goBack=function(){ 
    $scope.currentView=history.pop(); 
    } 
}]);

来源

2014-09-11 11:50:11

这真的很有用，如果我有更多的代表，我会为此投票。谢谢。 – 2014-09-12 07:54:51

Angularjs - 更改模板而不更改网址

回答

相关问题