个人中心
文章发布
退出
作者热门文章
- iOS/Objective-C 元类和类别
- objective-c - -1001 错误，当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
25
4
我正在尝试在 AngularJS (1.6.9) 中模拟 Controller 继承，但我在控制台上收到错误消息:Function.prototype.bind.apply(...) is not a constructor
这是 HTML 文件:
<!-- Controller Inheritance -->
<!DOCTYPE html>
<html lang="en" ng-app="app7">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Tutorial 7</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body>
<div ng-controller="mainCtrl as parent">
<p>Name: {{parent.name}}</p>
<p>Sound: {{parent.sound}}</p>
<button ng-click="parent.animalClick()">Animal Data</button>
</div>
<br><br>
<div ng-controller="dogCtrl as dog">
<p>Name: {{dog.child.name}}</p>
<p>Sound: {{dog.child.sound}}</p>
<button ng-click="dog.child.animalClick()">Dog Data</button>
<button ng-click="dog.child.dogData()">Get More Data</button>
</div>
<script src="js/exam7.js"></script>
</body>
</html>
这是 JS 文件:
//Controller Inheritance Demonstration
let app7 = angular.module('app7',[]);
//Parent Controller
app7.controller('mainCtrl',()=>{
this.name="Animal";
this.sound="Silent";
this.animalClick= ()=>{
alert(this.name+' says '+this.sound);
};
});
//Child Controller
app7.controller('dogCtrl',($controller)=>{
let childCtrl = this;
childCtrl.child=$controller('mainCtrl',{});
childCtrl.child.name="Dog";
childCtrl.child.bark="Woof"; //child`s own variable
childCtrl.child.dogData = ()=>{
alert(this.name+' says '+this.sound+' and '+this.bark);
};
});
我试图在 childCtrl 中继承 mainCtrl 但无法这样做。输出不符合预期。这种错误背后的可能原因是什么？
最佳答案
你不能在 AngularJS 中到处使用arrow notation。
AngularJS 尝试使用 new your_function(){...} 方法调用一个函数，将其视为一个类，但它无法使用箭头符号 new () =>{...}.
简单的改变
app7.controller('mainCtrl',()=>{
到
app7.controller('mainCtrl',function(){
(以及其他地方)
您在打印子值时也有错误的逻辑。在打印任何内容之前，您需要先访问 .child. 子属性。
这是您的代码的一个工作示例:
let app7 = angular.module('app7', []);
//Parent Controller
app7.controller('mainCtrl', function() {
this.name = "Animal";
this.sound = "Silent";
this.animalClick = () => {
alert(this.name + ' says ' + this.sound);
};
});
//Child Controller
app7.controller('dogCtrl', function($controller) {
let childCtrl = this;
childCtrl.child = $controller('mainCtrl', {});
childCtrl.child.name = "Dog";
childCtrl.child.bark = "Woof"; //child`s own variable
childCtrl.child.dogData = () => {
alert(this.child.name + ' says ' + this.child.sound + ' and ' + this.child.bark);
};
});<!DOCTYPE html>
<html lang="en" ng-app="app7">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Tutorial 7</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body>
<div ng-controller="mainCtrl as parent">
<p>Name: {{parent.name}}</p>
<p>Sound: {{parent.sound}}</p>
<button ng-click="parent.animalClick()">Animal Data</button>
</div>
<br><br>
<div ng-controller="dogCtrl as dog">
<p>Name: {{dog.child.name}}</p>
<p>Sound: {{dog.child.sound}}</p>
<button ng-click="dog.child.animalClick()">Dog Data</button>
<button ng-click="dog.child.dogData()">Get More Data</button>
</div>
</body>
</html>关于javascript - 获取 Function.prototype.bind.apply(...) 不是构造函数错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49273401/
25
4
0
以下代码，我使用 chrome 浏览器控制台进行了检查: function A(){ this.a='a' } 这是一个构造函数。我已经将一个属性 b 赋给了 A 的原型(prototype)。
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
关闭。这个问题是opinion-based .它目前不接受答案。 想改进这个问题？更新问题，以便 editing this post 提供事实和引用来回答它. 5年前关闭。 Improve this
关闭。这个问题是opinion-based .它目前不接受答案。 想改进这个问题？更新问题，以便 editing this post 提供事实和引用来回答它. 3年前关闭。 Improve this
我已经开始阅读 The Pragmatic Programmer，我很喜欢并学习堆形式，但我很难理解示踪子弹和原型(prototype)之间的区别。跟踪项目符号是否像拥有应用程序的所有 View 但尚
尽管阅读了 StackOverflow 上的大多数文章，但我现在实际上对原型(prototype)非常困惑。 function Foo() { } Foo.prototype.speak = func
我正在阅读以下代码，并开始想知道 Rectangle.prototype = Object.create(Shape.prototype) 和 Rectangle.prototype = Shape.
我想知道它们之间的区别: childObj.prototype = Object.create(parentObj.prototype) 和 childObj.prototype = parentOb
这个问题在这里已经有了答案: Why wouldn't I use Child.prototype = Parent.Prototype rather than Child.prototype =
在 node.js 中导出原型(prototype)的首选方法是什么？您可以采用两种方法: 导出原型(prototype)本身 function A () { } module.exports = A
我正在学习 JavaScript，发现了两种分配原型(prototype)的方法。 第一个是A.prototype = B.prototype，第二个是A.prototype = new B() 例如
在一些构造函数的定义之后，例如 child ，我见过以下两种形式: Child.prototype = Parent.prototype; 或 Child.prototype = new Parent
我正在阅读一本关于 OOP javascript 的书，但被其中一个示例卡住了。 在示例代码的第一个版本中，Shape 的一个新实例构造函数被创建并且 toString方法被调用。 toString方
这个问题在这里已经有了答案: What should I connect to the child prototype property in JavaScript (2 个答案) 关闭 8 年前。
在进行原型(prototype)设计时，您在多大程度上放弃了最佳实践来支持代码和修复黑客攻击？当然，代码并不打算在完整的生产环境中保留。 补充:我正在研究一个用 Python 制作的相当大的半工作原型
我正在尝试使用 Prototype 更新隐藏表单字段的值。表单域: 我正在尝试使用原型(prototype)更新值: var additionalVal = ',2'; var itemId = $
我正在阅读How to Make a Javascript Library我发现了作者所说的一个观点: function _() { //Some obects and var
我想用一个新函数扩展“Number”类型，因此我必须定义一个原型(prototype)。当我想到这一点时，我得到了一堆问题: Number 是否既继承了 Object.prototype 又继承了 F
这里好像有区别... 假设我们有 function MyConstructor() {} MyConstructor 的[[Prototype]] 是Function.prototype，不是 MyC
有人建议 Derived.prototype = Object.create(Base.prototype); 优于 Derived.prototype = new Base(); (如 this S
我是一名优秀的程序员,十分优秀！