gpt4 book ai didi

javascript - 切换 View 不会以 Angular 切换 Controller

转载 作者:行者123 更新时间:2023-11-28 07:08:03 29 4
gpt4 key购买 nike

我有一个简单的 Angular 应用程序,它使用两个模板和 Controller 。放置两个按钮来切换 View 。它们调用在控件内定义的函数,该函数使用 window.location='' 来切换位置。

但是,如果我放置 ng-controller 指令,模板会发生变化,但 Controller 不会发生变化。但如果我只是删除 ng-controller 指令,则根本不会加载任何 Controller ,但会呈现默认 View 。

出了什么问题?这是我的代码:

HTML:

<body ng-app='schoolConnect' ng-controller='takeCtrl' >
<div ng-show='loading' style='margin-top:100px' >
<!--content-->
</div>
<table width=40% align='center' style='margin-bottom:10px' >
<tr>
<td align='center' >

<!-- BUTTONS THAT SWITCH THE VIEW -->
<div class='btn-group' >
<button class='btn btn-lg' ng-class='take_btn' ng-disabled='isTaking' ng-click='takeAttend()' >
&nbsp;Take&nbsp;
</button>
<button class='btn btn-lg' ng-class='view_btn' ng-disabled='isViewing' ng-click='viewAttend()' >
&nbsp;View&nbsp;
</button>

</div>
</td>
</tr>
</table>
<table width=40% align='center' >
<!-- Some content that contains ng-models and ng-binds -->
</table>

<!-- This table Contains the rendered views -->
<table align='center' class="table table-striped table-hover table-bordered table-condensed" style='width:60%' ng-view></table>

</body>

</html>

Javascript:

/*********************************
*>Apply controller to angular app**
*>Define major functions **********
********************************/

//Initalize app
var app=angular.module('schoolConnect',['ngSanitize','ngRoute']);

//Define Views

function configViews($routeProvider)
{
$routeProvider
//default view is Take Attendance
.when('/take',{
templateUrl: 'partials/takeAttendance.html', controller: "takeCtrl"
})

//View for tviewing attendance
.when('/view',{
templateUrl: 'partials/viewAttendance.html', controller: "viewCtrl"
})

.otherwise({
redirectTo:'/take'
});
}

//Assign Views
app.config(configViews);



//Assign controllers

//Take Attendance-Controller
app.controller('takeCtrl',takeCtrl);

//Define Controller
function takeCtrl($scope,$http){
$scope.pageTitle='Attendance';

//************INITIALIZE SOME VARIABLES AS REQUIRED*****
$scope.view_btn='btn-danger';
$scope.take_btn='btn-default';
$scope.isTaking=true;
$scope.isViewing=false;

//SOME MORE CODE HERE

} //CONTROLLER 1 ENDS


//View Attendace-Controller
app.controller('viewCtrl',viewCtrl);

//Define Controller
function viewCtrl($scope,$http){
$scope.pageTitle='Attendance';

//************INITIALIZE SOME VARIABLES AS REQUIRED*****
$scope.view_btn='btn-default';
$scope.take_btn='btn-danger';
$scope.isTaking=false;
$scope.isViewing=true;

//SOME MORE CODE HERE

} //CONTROLLER 2 ENDS

View 加载得很好,但 Controller 是相同的。如果我将其从 body 标记中删除,则根本没有 Controller ..

最佳答案

如果您将 Controller 绑定(bind)到路由提供者中的 View ,则无需使用 ng-controller。

<body ng-app='schoolConnect' >

注入(inject)$location服务以正确切换 View 。

viewCtrl($scope,$http,$location){

并使用path方法切换到指定 View :

$location.path('/take');

然后在index.html中插入ng-view

<div ng-view></div>

在此 div 中将有来自路线的 View 。

关于javascript - 切换 View 不会以 Angular 切换 Controller ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31549251/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com