2015-12-23 5 views
6

मैं अपने आवेदन के लिए नए मार्ग उत्पन्न करने के लिए angular-fullstack generator का उपयोग कर रहा हूं। वाक्यविन्यास really unfamiliar है और एक वर्ग की तरह संरचना का उपयोग करता है। मैं $ scope और $ watch जैसी चीज़ों को इंजेक्ट करने के लिए इसके साथ कैसे काम करूं? मुख्य बात जो मैं करना चाहता हूं वह एक विशेष चर के लिए एक बदलाव के लिए देखना है। वाक्यविन्यास नीचे है। किसी को पता है कि इसके साथ कैसे काम करना है?

'use strict'; 

(function() { 

class MainController { 

    constructor($http) { 
    this.$http = $http; 
    this.awesomeThings = []; 

    $http.get('/api/things').then(response => { 
     this.awesomeThings = response.data; 
    }); 
    } 

    addThing() { 
    if (this.newThing) { 
     this.$http.post('/api/things', { name: this.newThing }); 
     this.newThing = ''; 
    } 
    } 

    deleteThing(thing) { 
    this.$http.delete('/api/things/' + thing._id); 
    } 
} 

angular.module('myapp') 
    .controller('MainController', MainController); 

})(); 

मैं $ घड़ी कैसे इंजेक्षन ताकि मैं की तरह कुछ कर सकते हैं करते हैं: वे (मेरे धारणा) इच्छुक रहे हैं आप कोणीय के controllerAs सिंटैक्स का उपयोग करने के लिए

this.$watch('awasomeThings', function() { ... }); 

उत्तर

5

। जब आप ऐसा करते हैं, तो आप $scope का उपयोग करके बहुत कम (यदि बिल्कुल) का उपयोग करते हैं।

कारण यह है कि आपके विचार अब दायरे से सीधे बंधे नहीं हैं, वे नियंत्रक के गुणों से बंधे हैं। ऊपर अपने MyController उदाहरण में तो, विचारों नियंत्रक है कि आप की आपूर्ति के लिए एक नाम का उपयोग कर awesomeThings की सरणी का उपयोग कर सकते हैं:

<body ng-controller="MyController as myCtl"> 
    <p ng-repeat="thing in myCtl.awesomeThings">{{thing}}</p> 
</body> 

एक मामले में जहां आप अभी भी $scope उपयोग करने की आवश्यकता है जब आप $scope.$watch() उपयोग करना चाहते हैं।

class MyController { 

    constructor($scope) { 
    // use the $scope.$watch here or keep a reference to it so you can 
    // call $scope.$watch from a method 
    this.$scope = $scope; 
    } 

} 

पुनश्च:: इस मामले में, उसी तरह यह ऊपर $http के साथ किया जा रहा है अपने नियंत्रक में $scope इंजेक्षन, इस वाक्य रचना सबसे अधिक संभावना ES6 है लेकिन मैं गलत हो सकता है ... मैं टाइपप्रति का उपयोग जो बहुत लग रहा है समान।

+0

बिल्कुल सही, धन्यवाद। यह अब और अधिक समझ में आता है। मुझे लगता है कि वे वास्तव में नियमित रूप से javacript करने के लिए ES6 और [Babel] (https://babeljs.io/) का उपयोग कर रहे हैं। – jOshT

+1

यदि आप ES6 का उपयोग कर रहे हैं, तो आप 'स्थिर $ इंजेक्ट = [' $ स्कोप '] डालने से भी अपने DI (सुरक्षित न्यूनीकरण के लिए) घोषित कर सकते हैं;' बस कक्षा परिभाषा के तहत और कन्स्ट्रक्टर फ़ंक्शन से पहले। यदि आपका ईएस 6 ट्रांसलेटर उस स्थिर परिभाषा का समर्थन करता है। –

संबंधित मुद्दे