Блог

 angular.module('DemoApp', ['ionic'])

.run(function($rootScope){
$rootScope.items = [];
})
.config(function( $stateProvider, $urlRouterProvider) {

  $stateProvider
    .state('eventmenu', {
      url: "/event",
      abstract: true,
      templateUrl: "templates/event-menu.html"
    })
    .state('eventmenu.home', {
      url: "/home",
      views: {
        'menuContent' :{
          templateUrl: "templates/home.html"
        }
      }
    })
   
    .state('eventmenu.attendees', {
      url: "/attendees",
      views: {
        'menuContent' :{
          templateUrl: "templates/hello.html",
          controller: "helloCtrl"
        }
      }
    })
  
  $urlRouterProvider.otherwise("/event/home");
})

.controller('MainCtrl', function($scope) {})


/********
            
            ██   ██ ███████ ██████  ███████
            ██   ██ ██      ██   ██ ██
            ███████ █████   ██████  █████
            ██   ██ ██      ██   ██ ██
            ██   ██ ███████ ██   ██ ███████
            


********/

.controller('helloCtrl', function($scope, $interval, $rootScope) {
  
 $scope.$on('$ionicView.beforeLeave', function() {
          
        });
  
}).directive('helloWorld', function ($http, $q, $interval, $rootScope) {
  return {
    restrict: 'AECM',
    replace: true,
    templateUrl: 'hellotemplate.html',
    link: function ($scope, event, attr){
     console.log('vcae')
    	$scope.newData = function(){
      		console.log("now I have new Data");
           $http.get("https://api.github.com/users/maxmpz/repos").then(function(response){
       $scope.helloData  = {}
       $rootScope.items = response.data;
        $scope.helloData.data = $rootScope.items;
        
       
        });
      };
      $http.get("https://api.github.com/users/distante/repos").then(function(response){
      $scope.helloData = {}
       $rootScope.items = response.data;
        $scope.helloData.data = $rootScope.items;	
        
        });
        
        
    }
  };
});  

 <link href="https://code.ionicframework.com/1.3.1/css/ionic.min.css" rel="stylesheet"/>
<script src="https://code.ionicframework.com/1.3.1/js/ionic.bundle.js"></script>
<link href="http://code.ionicframework.com/1.0.0-rc.0/css/ionic.css" rel="stylesheet"/>

<div ng-controller="MainCtrl" ng-app="DemoApp">
<ion-nav-view></ion-nav-view>

    <script id="templates/event-menu.html" type="text/ng-template">
      <ion-side-menus enable-menu-with-back-views="false">

        <ion-side-menu-content>
          <ion-nav-bar class="bar-positive">
            <ion-nav-back-button>
            </ion-nav-back-button>

            <ion-nav-buttons side="left">
              <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
              </button>
            </ion-nav-buttons>
          </ion-nav-bar>

          <ion-nav-view name="menuContent"></ion-nav-view>
        </ion-side-menu-content> 

        <ion-side-menu side="left">
          <ion-header-bar class="bar-assertive">
            <h1 class="title">Menu</h1>
          </ion-header-bar>
          <ion-content>
            <ul class="list">
          
              <a href="#/event/home" class="item" menu-close>Home</a>
              <a href="#/event/attendees" class="item" menu-close>State view</a>
            </ul>
          </ion-content>
        </ion-side-menu>

      </ion-side-menus>
    </script>

    <script id="templates/home.html" type="text/ng-template">
      <ion-view view-title="Welcome">
        <ion-content class="padding">
          <h1>HOME VIEW</h1>
					<p>There is a "new Data" button on my State view, if you click it the view directive contents will be updated but in here the contents will be the same</p>
          <hello-world></hello-world>
        </ion-content>
      </ion-view>
    </script>

   
  <script id="hellotemplate.html" type="text/ng-template">
  <div class="list">
  <h1>State view</h3>
            
            <ion-item ng-repeat="data in items">
              {{ data.name }}
            </ion-item>
        
            
          </div>
  </script>
    <script id="templates/hello.html" type="text/ng-template">
      <ion-view view-title="some silly example">
        <ion-content>
        <p>This button will update this view directive, but the same directive in Home will be not updated. I do do not know how to fix this </p>
        <ion-item><button ng-click="newData()">new Data </button></ion-item>
        <hello-world></hello-world>
        </ion-content>
      </ion-view>
    </script>
        </div>