किसी अन्य नियंत्रक के अंदर से मॉडल अपडेट करें

Question

मैं फ़ॉर्म सबमिट करने के बाद, तालिका में डेटा की एक नई पंक्ति को धक्का देने की कोशिश कर रहा हूं। हालांकि, मेज, जो UrlListCtrl कहा जाता है रूप है, जो UrlFormCtrl.

function UrlFormCtrl($scope, $timeout, UrlService) { 
    $scope.message = ''; 
    var token = ''; 
    $scope.submitUrl = function(formUrls) { 
     console.log('Submitting url', formUrls); 
     if (formUrls !== undefined) { 
     UrlService.addUrl(formUrls).then(function(response){ 
      $scope.message = 'Created!'; 
      // I need to update the view from here 
     }); 
     } else { 
     $scope.message = 'The fields were empty!'; 
     } 
    } 

UrlFormCtrl में है से अलग है, मैं डेटाबेस के लिए एक सरणी भेज रहा हूँ संग्रहीत करने के लिए, बाद में मैं दृश्य को अपडेट करना चाहते हैं, जहां UrlListCtrl इसे संभालता है।

function UrlListCtrl($scope, $timeout, UrlService){ 
    UrlService.getUrls().then(function(response){ 
     $scope.urls = response.data; 
    }); 
    } 

मैं नया डेटा $scope.url पर धक्का देने की कोशिश कर रहा हूं। यहां सेवा है:

function UrlService($http) { 

    return { 
     addUrl: addUrl, 
     getUrls: getUrls 
    } 

    function addUrl(formUrls) { 
     console.log('adding url...'); 
     return $http.post('urls/create', { 
     original_url: formUrls.originalUrl, 
     redirect_url: formUrls.redirectUrl 
     }); 
    } 

    function getUrls() { 
     return $http.get('urls/get'); 
    } 


    } 

मैं अभी भी कोणीय को समझने की कोशिश कर रहा हूं, इसलिए यह मेरे लिए बहुत जटिल है। मैं UrlFormCtrl के भीतर $scope.urls कैसे अपडेट कर सकता हूं?

Answer 1

मुझे यकीन नहीं है कि मैं आपका प्रश्न पूरी तरह से समझता हूं लेकिन मैं इसे किसी भी तरह उत्तर देने का प्रयास करूंगा =)।

तो आप एक वेरिएबल को अपडेट करने का प्रयास कर रहे हैं जिसका मूल्य किसी अन्य नियंत्रक में बदला गया था?

वह जगह है जहां service उपयोगी हो सकता है।

यहाँ बुनियादी कदम हैं:

सेवा में, आप है कि चर:

myApp.controller('FirstController', function(...){ 

    $scope.$watch(function() { 
     return ServiceName.urls; 
    }, function (newVal) { 
     $scope.urls = newVal; 
    }); 

}) 

:

myApp.service('ServiceName', ['$http', function(){ 
    var urls = []; 

    return{ 
     urls: urls 
    } 
}]) 

एक नियंत्रक, जहां कि नए मूल्य प्राप्त करना चाहते हैं में $watch रखो

फिर, आप इसे किसी अन्य नियंत्रक से बदलते हैं:

myApp.controller('SecondController', function(...){ 

    ServiceName.urls.push('newValue'); 

}) 

यह करना चाहिए। $scope.urls को पहले नियंत्रक में अपडेट किया जाएगा भले ही यह दूसरे में बदला गया हो।

$watch की अवधारणा आपके लिए नई हो सकती है। तो यह मूल रूप से कॉलबैक फ़ंक्शन निष्पादित करता है, जब भी पहला फ़ंक्शन एक नया मान देता है। यही है, जब भी परिवर्तनीय परिवर्तन देखा जा रहा है।

आपके मामले में:

आप अपनी सेवा के अंदर एक चर होगा:

function UrlService($http) { 

    var urls = []; 

    function addUrl(formUrls) { 
     console.log('adding url...'); 
     return $http.post('urls/create', { 
     original_url: formUrls.originalUrl, 
     redirect_url: formUrls.redirectUrl 
     }); 
    } 

    function getUrls() { 
     return $http.get('urls/get'); 
    } 

    return { 
     addUrl: addUrl, 
     getUrls: getUrls 
     urls: urls 
    } 
} 

रखो एक $watchUrlListCtrl अंदर:

function UrlListCtrl($scope, $timeout, UrlService){ 
    $scope.$watch(function() { 
     return UrlService.urls; 
    }, function (newVal) { 
     $scope.urls = newVal; 
    }); 
} 

फिर, urls का मूल्य बदल UrlFormCtrl से:

$scope.submitUrl = function(formUrls) { 
    if (formUrls !== undefined) { 
    UrlService.addUrl(formUrls).then(function(response){ 
     $scope.message = 'Created!'; 
     UrlService.urls = response['urls']; 
    }); 
    } else { 
    $scope.message = 'The fields were empty!'; 
    } 
} 

$watch आप अंदर UrlListCtrl डाल बीमा होगा कि नए मूल्य UrlFormCtrl अंदर $scope.urls को सौंपा जाएगा।