2016-08-30 3 views
1

내가 배수 전망이 있지만, 네비게이션 바에서 동일한 검색 입력이 질문은 다음과 같습니다 어떻게 view1Ctrl, View2Ctrl 또는 데이터를 업데이트하려면 메뉴 바에서 입력을 사용 anyCtrl여러 경로 동일한 검색 입력

- ----- EDIT 1 개 ------- 내 질문은 내가 view1Ctrl, View2Ctrl 또는 anyCtrl 및 컨트롤러가있는 경우 알고있는 방법으로 데이터를 업데이트하려면 메뉴 바에서 입력을 사용할

특정하지 않았다 serch 입력이 사용됩니까? 실제 코드에서

난은 $ HTTP GET을 함수를 호출하고을 uptate과 성공에 배열

$scope.loadMore = function() { 
$scope.busy = true 
data.all(page) 
    .then(function success (response) { 
     var data = response.data 
     for(var i = 0; i < data.length; i++) { 
      $scope.array1.push(data[i]) 
     } 
     page++ 

     $scope.busy = false 
    }) 
} 

$scope.searchData = function (search) { 
$scope.busy = true 
$scope.array1 = []; 
data.all(page, search) 
    .then(function success (response) { 
     var data = response.data 
     for(var i = 0; i < data.length; i++) { 
      $scope.array1.push(data[i]) 
     } 
     page++ 

     $scope.busy = false 
    }) 
} 

내가 의심을 명확히하기 위해 plnkr를 만들 업데이트 서비스가있다. 도움을

https://plnkr.co/edit/tENpWjPAzbV0GBg52L1V?p=preview

감사합니다!

App.js

var app = angular.module('plunker', ['ui.router']); 
 

 
app.config(function($stateProvider, $urlRouterProvider) { 
 
    $urlRouterProvider 
 
    .otherwise("/home/view1"); 
 

 
    $stateProvider 
 
    .state('home', { 
 
     url: "/home", 
 
     templateUrl: "./home-main.html", 
 
    }) 
 

 
    .state('home.view1', { 
 
    url: "/view1", 
 
    templateUrl: "./view1.html", 
 
    controller: "view1Ctrl" 
 
    }) 
 

 
    .state('home.view2', { 
 
    url: "/view2", 
 
    templateUrl: "./view2.html", 
 
    controller: "view2Ctrl" 
 
    }) 
 
}) 
 

 

 
app.directive('navbar', function() { 
 
    return { 
 
    restrict: 'EA', 
 
    templateUrl: './navbar.html', 
 
    controller: 'view1Ctrl' 
 
    } 
 
}) 
 

 
app.controller('view1Ctrl', function($scope) { 
 
    $scope.array1 = [1, 2, 3, 4]; 
 
    $scope.search = '' 
 

 
    $scope.onSearch = function() { 
 
    console.log('calling onSearch') 
 
    $scope.array1 = [1.1, 1.2, 1.3, 1.4] 
 
    } 
 
}); 
 

 
app.controller('view2Ctrl', function($scope) { 
 
    $scope.array1 = [1, 2, 3, 4]; 
 
    $scope.search = '' 
 

 
    $scope.onSearch = function() { 
 
    console.log('calling onSearch') 
 
    $scope.array1 = [1.1, 1.2, 1.3, 1.4] 
 
    } 
 
});

+0

가 서비스로 onSearch를 넣고 당신은 모든 컨트롤러에 주입 각 서비스에 대한 구글 수 :다음은 루트 HTML 페이지에 새 사용자 정의 요소를 추가 할 수 있습니다. 또는 navbar에 대한 컨트롤러를 만들고 모든 경로에 사용할 수 있습니다. –

+0

이것이 내 생각 이었지만 컨트롤러가 데이터가 변경되는지 어떻게 알 수 있습니까? –

답변

0

이 중첩 된 뷰 시도 :

.state('home.nav', { 
        url: "/", 

        '[email protected]': { 
         templateUrl: './navbar.html', 
         controller: 'view1Ctrl' 
        } 
       }) 

을하거나 추상적 사용할 수 있습니다

.state('my-app', { 
         abstract: true, 
         views: { 
          'navtest': { 
           templateUrl: './pathTonav', 
           controller: "navcontroller" 
          } 
         } 
        }) 
<div ui-view="navtest"><\div> 
+0

navbar의 입력을 사용하여 view1Ctrl, View2Ctrl 또는 anyCtrl의 데이터를 업데이트하고 싶습니다. –

0
app.directive('navbar', function() { 
    return { 
    restrict: 'EA', 
    templateUrl: './navbar.html', 
    controller: 'navbarCtrl' 
    } 
}); 

app.controller('navbarCtrl', function($scope){ 
    //your search stuff 
} 

<body ng-app='youreapp'> 
    <navbar></navbar> 
    <div ng-view></div> 
</body> 
+0

그런 식 으로요? –

+0

아니, 난 plunker를 확인하는 경우이 부분을 해결했습니다, nav1에서 view1Ctrl 또는 View2Ctrl 데이터를 업데이트하려면 입력을 사용하고 싶습니다 –

관련 문제