Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在视图中重新初始化$scope变量';s控制器以角度重新加载?_Javascript_Angularjs_Controller_Reload - Fatal编程技术网

Javascript 如何在视图中重新初始化$scope变量';s控制器以角度重新加载?

Javascript 如何在视图中重新初始化$scope变量';s控制器以角度重新加载?,javascript,angularjs,controller,reload,Javascript,Angularjs,Controller,Reload,我有一个简单的角度网络应用程序,我有问题,当我重新访问路线。在第一次访问时,路线的控制器使一切正常工作。在第二次访问时,情况发生了变化。控制器在视图中设置画布元素的维度。控制器的简化示例: // app.js var app = angular.module('noahdecocoApp', ['ngAnimate', 'ngCookies', 'ngResource', 'ngRoute', 'ngSanitize', 'ngTouch']); app.config(function ($r

我有一个简单的角度网络应用程序,我有问题,当我重新访问路线。在第一次访问时,路线的控制器使一切正常工作。在第二次访问时,情况发生了变化。控制器在视图中设置画布元素的维度。控制器的简化示例:

// app.js
var app = angular.module('noahdecocoApp', ['ngAnimate', 'ngCookies', 'ngResource', 'ngRoute', 'ngSanitize', 'ngTouch']);

app.config(function ($routeProvider) {
  $routeProvider
    .when('/particle-page', {
      templateUrl: 'views/particle.html',
      controller: 'ptclCtrl'
    })
});

// ptclCtrl.js
app.controller('ptclCtrl', function($scope){
  var canvas = document.getElementById("ptclCanvas");
  var ctx = canvas.getContext("2d");
  ctx.canvas.width  = 500;
  ctx.canvas.height = 500;
});

//particle.html
<canvas id='ptclCanvas'></canvas
//app.js
var app=angular.module('noahdecoapp'、['ngAnimate'、'ngCookies'、'ngResource'、'ngRoute'、'ngSanitize'、'ngTouch']);
app.config(函数($routeProvider){
$routeProvider
。当(“/粒子页”{
templateUrl:'views/particle.html',
控制器:“ptclCtrl”
})
});
//ptclCtrl.js
应用程序控制器('ptclCtrl',函数($scope){
var canvas=document.getElementById(“ptclCanvas”);
var ctx=canvas.getContext(“2d”);
ctx.canvas.width=500;
ctx.canvas.height=500;
});
//particle.html

将需要执行一次的逻辑放入run块或config中。这样它只初始化一次

执行顺序:

app.config()
app.run()
app.controller() 

var app = angular.module('myApp',[]);

app.run(function() {
});

这根本不是棱角分明的。在angular中,您从未(对我重复)在控制器中执行DOM操作。如果你发现你自己在做,不要

DOM操作是在指令中完成的,因此您可以执行以下操作:

app.directive('resizeCanvas', function() {
  return {
    link: function(scope, element, attrs) {
      var ctx = element[0].getContext("2d");
      ctx.canvas.width  = 500;
      ctx.canvas.height = 500;
    } 
  };
});
然后:

<canvas resize-canvas></canvas>


这将为您调整大小,不涉及控制器。

谢谢您的帮助,但这不起作用。每次在特定视图上时,我都需要调用脚本。我尝试将脚本放在app.run中的函数中,并从ptclCtrl控制器调用它,但这给了我与启动ie时相同的结果:在第一次加载时工作,而不是在第二次加载时工作。你能发布你是如何进行路由的,以及ptclCtrl是如何使用的吗?当然!我刚刚更新了我的帖子,加入了一些app.js和particle.html。这不是整个块,只是相对位。谢谢,啊哈!我知道这将是一个“角度思考”的问题。非常感谢你指出这一点。哇,我现在必须重新检查我所有的其他控制器。但这是否意味着我会在这里添加所有js代码?例如,我将在画布上添加粒子并设置其动画,这将与用户的鼠标交互。所有的东西都放在这里,还是有另一种角度。非常感谢任何为我指明正确方向的帮助!顺便说一句,你解释一下。是的,你可以创建一个指令来制作所有这些粒子的动画,然后像我在我的例子中做的那样粘贴到画布上。太棒了!非常感谢你的帮助。这是我第一次尝试用Angular做任何事情,真的需要重新布线才能理解:D