![](/img/trans.png)
[英]How to use Angular $scope.variable from controller 1 in ng-class of div using controller 2
[英]Angular + Typescript: Use Directive Class Scope Variable in Controller Class
弄清楚Angular Typescript還有另一個問題; 這次是關於控制器的指令。 嘗試將對象從頁面傳遞到指令,然后在指令的控制器中使用該對象。 也許這不是正確的方法,但對我來說似乎很有意義。 只是無法弄清楚如何訪問控制器中的對象。
頁面HTML:
<div>
<section>
On View: {{ee.obj.name}}
<image-upload obj="ee.obj"></image-upload>
</section>
</div>
指令模板:
<div>
On directive: {{obj.name}}
On controller: {{iuc.obj.name}}
<div class="row">
<div class="col-md-4 text-primary h4">
Add Images
</div>
</div>
<div class="row">
<div class="col-md-3">
<input type="file" multiple ng-model="iuc.imageUploads" ng-change="iuc.uploadImages()" />
</div>
</div>
<div class="row">
<div class="col-md-3 dropzone"></div>
</div>
</div>
指令打字稿:
/// <reference path="../../../scripts/_all.ts" />
module ObjConfig {
'use strict'
export class ImageUpload implements ng.IDirective {
static instance(): ng.IDirective {
return new ImageUpload();
}
restrict = 'E';
replace = true;
templateUrl = '../../../../App/AppConfig/Views/Directives/ImageUpload.html';
scope = {
obj: '='
};
controller = imageUploadCtrl;
controllerAs = 'iuc';
}
export class imageUploadCtrl {
obj: OBJBase;
imageUploads: OBJImage[];
constructor() {
}
uploadImages() {
//THIS IS WHERE I WANT TO ACCESS OBJ
//this.imageUploads.forEach((iu) => { this.obj.images.push(iu); });
}
}
angular.module('ObjConfig').directive('imageUpload', ImageUpload.instance);
}
當我在方法中使用“ this.obj”時,它以未定義的形式返回,因此顯然控制器“ obj”不會自動連接到指令“ obj”。 頁面上的ee.obj.name顯示值,指令模板頂部的obj.name顯示值,但iuc.obj.name不顯示值。 因此,我一直在嘗試找到一種將指令obj鏈接到控制器obj的方法,並且嘗試使用鏈接函數來使用ng.IAttributes,但這並沒有給我對象。 它給了我ee.obj。
任何幫助將不勝感激。
您應該能夠使用bindToController: true
完成您想做的事情。
該功能已在$compile
文檔中進行$compile
說明 ,因此,查找起來並不容易,但是可以滿足您的要求。
當隔離范圍用於組件(請參見上文),並且使用
controllerAs
,bindToController: true
將允許組件將其屬性綁定到控制器而不是范圍。 實例化控制器時,隔離范圍綁定的初始值已經可用。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.