2014-05-04 9 views
11

मुझे अपने कोणीय जेएस प्रोजेक्ट में $ स्कोप के साथ परेशानी हो रही है। जब मैं इनपुट क्षेत्र पर ng-model = "modelExample" का उपयोग करता हूं उदाहरण के लिए, मैं $ zope $ mopelExample का उपयोग करके अपने जेएस में इसे एक्सेस नहीं कर सकता। क्या किसी और को भी यही समस्या है?मेरा एनजी-मॉडल परिवर्तक नियंत्रक में अपरिभाषित क्यों है?

यह विचित्र है, एक फ़ंक्शन कहा जाता है लेकिन एनजी-मॉडल बाध्य नहीं होता है। नीचे अपना कोड देखें, जब मैं फॉर्म सबमिट करता हूं तो फ़ंक्शन रीफ्रेश रीसेट्स() को कॉल किया जाता है लेकिन $ scope.search अनिर्धारित के रूप में लौटाता है।

angular.module('starter', 
    ['ionic', 
    'starter.controllers', 
    'starter.filters', 
    'akoenig.deckgrid', 
    "angucomplete", 
    // 'ui.bootstrap', 
    'starter.services']) 

.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 
     .state('app', { 
      url: "/app", 
      abstract: true, 
      templateUrl: "templates/menu.html", 
      controller: 'AppCtrl' 
     }) 

     .state('app.browse', { 
      url: "/browse", 
      views: { 
       'menuContent' :{ 
        templateUrl: "templates/browse.html", 
        controller: 'BrowseCtrl' 
       } 
      } 
     }) 

     .state('app.search', { 
      url: "/search", 
      views: { 
       'menuContent' :{ 
        templateUrl: "templates/search.html", 
        controller: 'SearchCtrl' 
       } 
      } 
     }) 
    // if none of the above states are matched, use this as the fallback 
    $urlRouterProvider.otherwise('/app/browse'); 
}); 


angular.module('starter.controllers', []) 
.controller('SearchCtrl', function($scope) { 
    $scope.refreshResults = function() { 
     console.log($scope.search); 
    }; 
}) 


<ion-view> 
    <ion-content class="has-header"> 
     <form ng-submit="refreshResults()" class="bar bar-header item-input-inset"> 
      <label class="item-input-wrapper"> 
       <i class="icon ion-ios7-search placeholder-icon"></i> 
       <input type="search" placeholder="Search..." ng-model="search"> 
      </label> 
     </form> 
    </ion-content> 
</ion-view> 
+2

जहां 'SearchCtrl' HTML में ही है? –

+5

मुझे लगता है कि सबसे लोकप्रिय कोणीय प्रश्न विषय। इसे पढ़ें: http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html –

+1

@ डेविन ट्रायन, मैंने अपने प्रश्न को और कोड विवरण के साथ अपडेट किया। –

उत्तर

37

@ डेविड ट्रायन ने टिप्पणियों में मेरी समस्या हल की। मैं गुंजाइश गलत इस्तेमाल कर रहा था। मुझे किसी ऑब्जेक्ट का उपयोग स्ट्रिंग नहीं करना था। दूसरे शब्दों में मुझे ng-model="search.term"ng-model="search" जैसे कुछ करने की आवश्यकता है और इसे इस तरह जेएस में उपयोग करें: $scope.search.term। इसे विरासत के साथ करना है लेकिन लंबी कहानी छोटी है, अगर आपके एनजी-मॉडल में कोई डॉट (।) नहीं है, तो आप इसे गलत कर रहे हैं। http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html

धन्यवाद डेविड:

यहाँ और अधिक जानकारी है!

टॉम

+1

मुझे यह पसंद है, 'लंबी कहानी छोटी है, आप इसे गलत कर रहे हैं' धन्यवाद, मेरी समस्या तय – klskl

0

या सेट एनजी नियंत्रक = "SearchCtrl" नीचे की तरह आयन सामग्री टैग करने के लिए:

<ion-content class="has-header" ng-controller="SearchCtrl"> 
संबंधित मुद्दे