Javascript 从html调用angularjs控制器中的函数,未定义范围变量
我是angularjs的新手,需要知道如何从angularjs中的html调用控制器中定义的函数 我已经写了一个html代码Javascript 从html调用angularjs控制器中的函数,未定义范围变量,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,我是angularjs的新手,需要知道如何从angularjs中的html调用控制器中定义的函数 我已经写了一个html代码 First.html <input type="text" ng-model="model.name" name="name" /> Second.html <p g-bind-template>{{model.familyname}}</p> // it displays the value <div data-ng-
First.html
<input type="text" ng-model="model.name" name="name" />
Second.html
<p g-bind-template>{{model.familyname}}</p> // it displays the value
<div data-ng-controller="formCtrl" data-ng-init="init()">
</div>
非常感谢任何帮助
ngInit
指令用于运行表达式并分配范围变量。关于使用它,文档中有一个很好的警告:
此指令可能被滥用,以便在模板中添加不必要的逻辑量。ngInit只有一些合适的用途,例如,在下面的演示中可以看到,为ngRepeat的特殊属性别名;以及通过服务器端脚本注入数据。除了这几种情况之外,还应该使用控制器而不是ngInit来初始化作用域上的值
我建议在控制器中运行函数,而不是使用ngInit:
controllerFunction($scope) {
$scope.someFunction = someboundfunction;
//etc...
activate();
function activate() {
// do some activation stuff
}
function someboundfunction() {
//...
}
}
将可绑定成员放在顶部的编码风格使我在编写具有激活逻辑的大型控制器时不会发疯。如果您对此感兴趣的话,这是一个很好的解决方案。您需要将您想要使用的东西保存在这个控制器中,以使其工作
angular.module('TestApp',[]);
角度.module('TestApp')
.controller('formCtrl',['$scope','$window',函数($scope,$window){
$scope.model={
名称:“默认名称”
};
$scope.alertName=函数(其中){
警报(其中+':'+$scope.model.name);
};
$window.onload=函数(){
//将在ng init之后调用
$scope.alertName('On Load');
};
//直接从控制器调用它
$scope.alertName('From controller');
}]);代码>
提醒这个名字
{{model.name}}
欢迎来到安格拉斯的魔法世界。一开始可能会有点让人难以承受,但不要放弃。你走的方向是对的
对您编写的代码的一些建议-
-您需要将完整的代码封装在控制器中,以便能够处理进出控制器的数据。
-我假设您已经使用ng app或其他ng someName初始化了应用程序
-由于ng init用于初始化参数/方法,因此不需要在代码中提及它$scope会自动处理它(很酷,对吧!)
因此,在实现了上述建议之后,您的代码将如下所示-
//html代码
{{Username}}
让魔法开始吧!;) 这就是调用函数的方式(在编辑问题之前),但通常不需要使用nginit
。您在哪里为$scope.model.name
定义了值?从你所展示的,难怪它是未定义的。这就是我们所期望的。@Lex,我已经编辑了我的question@Lex在一个html中,我得到名称,在下一个html中,我在html中显示名称,在html中显示名称,但在控制器中,它在下一个html中显示为非线性,我需要model.name,然后在html加载时调用函数,在该函数上,我需要该名称,这就是它显示的原因undefined@Java_NewBie你可以在一个父控制器下组合多个HTML(带有相关控制器),并在其中包含必要的变量。之后,这些变量将以您想要的方式从html中访问。如何调用以html形式编写的函数。比如页面加载
controllerFunction($scope) {
$scope.someFunction = someboundfunction;
//etc...
activate();
function activate() {
// do some activation stuff
}
function someboundfunction() {
//...
}
}
//angular.js
app.controller('formCtrl', function($scope) {
$scope.Username = '';
});