AngularJS:如何从控制器功能切换视图? [英] AngularJS : How do I switch views from a controller function?

问题描述

我正在尝试使用 AngularJS 的 ng-click 功能来切换视图.我将如何使用以下代码执行此操作?

index.html

 
<div ng-click="someFunction()">点击我<div><div>

controller.js

 function Cntrl ($scope) {$scope.someFunction = function(){//改变视图的代码?}}

解决方案

为了在不同的视图之间切换，可以直接更改 window.location(使用 $location 服务！)index.html 文件

<div ng-click="changeView('edit')">编辑
<div ng-click="changeView('preview')">预览

Controller.js

function Cntrl ($scope,$location) {$scope.changeView = 函数(视图){$location.path(view);//路径不是哈希}}

并配置路由器根据位置切换到不同的部分(如下所示https://github.com/angular/angular-seed/blob/master/app/app.js).这将有利于历史以及使用 ng-view.

或者，您可以将 ng-include 与不同的部分一起使用，然后使用 ng-switch，如下所示 ( https://github.com/ganarajpr/Angular-UI-Components/blob/master/index.html )

I am trying to use the ng-click feature of AngularJS to switch views. How would I go about doing this with the code below?

index.html

 <div ng-controller="Cntrl">
        <div ng-click="someFunction()">
            click me
        <div>
    <div>

controller.js

  function Cntrl ($scope) {
        $scope.someFunction = function(){
            //code to change view?
        }
    }

解决方案

In order to switch between different views, you could directly change the window.location (using the $location service!) in index.html file

<div ng-controller="Cntrl">
        <div ng-click="changeView('edit')">
            edit
        </div>
        <div ng-click="changeView('preview')">
            preview
        </div>
</div>

Controller.js

function Cntrl ($scope,$location) {
        $scope.changeView = function(view){
            $location.path(view); // path not hash
        }
    }

and configure the router to switch to different partials based on the location ( as shown here https://github.com/angular/angular-seed/blob/master/app/app.js ). This would have the benefit of history as well as using ng-view.

Alternatively, you use ng-include with different partials and then use a ng-switch as shown in here ( https://github.com/ganarajpr/Angular-UI-Components/blob/master/index.html )

这篇关于AngularJS:如何从控制器功能切换视图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！