[英]My Controller constructor is never called (AngularJS)
I am setting up a small angularjs app inside a Sharepoint web part. 我正在Sharepoint Web部件内设置一个小型angularjs应用程序。 This is the first time doing this, but I made a demo work in this setting before doing the proper code.
这是第一次这样做,但是在进行适当的代码之前,我在此设置中进行了演示工作。 My problem now is that I think everything is properly hooked up, but the Controller constructor is never called?
我现在的问题是,我认为所有内容都已正确连接,但从不调用Controller构造函数? I am aware that the code is not complete, but at the very least I should enter the constructor and call the service.
我知道代码还不完整,但是至少我应该输入构造函数并调用服务。 The only alerts I see are the ones in the App file.
我看到的唯一警报是App文件中的警报。 Here are the different files:
以下是不同的文件:
HTML: HTML:
<div id="bidragsoplysninger2015App">
<div data-ng-controller="bidragsoplysninger2015Controller">
<div id="template-content" ng-include="'/AngularJS/Views/Bidragsoplysninger2015.html'"></div>
</div>
Partial: 部分:
<ul>
<li data-ng-repeat="indbetaling in indbetalinger | orderBy:'registreringsdato'">{{indbetaling.registreringsdato}} - {{indbetaling.beloeb}}</li>
</ul>
Model: 模型:
class Indbetaling {
constructor(
public beloeb: number,
public betalingsform: string,
public fagkode: string,
public indskudstype: string,
public institutionsNr: string,
public kundeNr: number,
public ordningNr: number,
public pensionsform: string,
public pensionsmodel: string,
public registreringsdato: Date,
public valoerMaaned: string
) {}
} }
Interface: 接口:
interface IIndbetalinger {
getIndbetalinger(cpr: string): Indbetaling[]
} }
Service: 服务:
class Bidragsoplysninger2015Service implements IIndbetalinger
{
private scope: any;
private http: any;
constructor($scope: ng.IScope, $http: ng.IHttpService) {
this.scope = $scope;
this.http = $http;
}
getIndbetalinger(cpr: string): Indbetaling[]
{
var promise = this.http.get('/_layouts/wpgenerelportal/Indbetalinger.aspx/GetIndbetalinger?cpr=' + cpr);
promise = promise.then(this.mapIndbetalinger).then(response => response.data);
return promise;
}
mapIndbetalinger(data) {
alert("Mapping!");
}
} }
Controller: 控制器:
class Bidragsoplysninger2015Controller {
private indbetalinger: Indbetaling[];
public static $inject = [
'$scope',
'bidragsoplysninger2015Service'
];
constructor(private $scope, private bidragsoplysninger2015Service: IIndbetalinger) {
alert("Controller constructor");
this.indbetalinger = $scope.indbetalinger = bidragsoplysninger2015Service.getIndbetalinger("110680-3419");
// 'vm' stands for 'view model'. We're adding a reference to the controller to the scope
// for its methods to be accessible from view / HTML
$scope.vm = this;
}
} }
App: 应用程式:
alert("In app 1");
var bidragsoplysninger2015AppModule = angular.module('bidragsoplysninger2015App', []);
bidragsoplysninger2015AppModule.service("bidragsoplysninger2015Service", Bidragsoplysninger2015Service);
bidragsoplysninger2015AppModule.controller("bidragsoplysninger2015Controller", Bidragsoplysninger2015Controller);
alert("In app 2");
$(document).ready(() => {
alert("In app 3");
angular.bootstrap($("#bidragsoplysninger2015App"), ['bidragsoplysninger2015App']);
});
I found the problem buried in this post: 'unknown provider error' in Angular app 我发现问题隐藏在这篇文章中: Angular应用中的“未知提供程序错误”
The sentence: "Services don't have $scope" was the key. 句子:“服务没有$ scope”是关键。 Once I removed the $scope as an input parameter to the service constructor, everything worked.
一旦删除了$ scope作为服务构造函数的输入参数,一切就可以正常工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.