Показать сообщение отдельно
  #6 (permalink)  
Старый 27.05.2013, 00:46
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

Цитата:
пару примеров оттуда,
Думаю нет смысла репостить примеры с оф сайта. Свои горазд ценнее

График и таблица связанные общими данными,
демонстрирует наследование scope контролами tableController и chartController от mainController

<!doctype html>
<html ng-app>
  <head>
      <style>
        .bar{
             width:50px;      
             background-color:#0F0;      
             margin-right:5px;      
             float:left;
         }
      </style>

    <script src="http://code.angularjs.org/1.1.5/angular.min.js"></script>
    <script language="javascript" type="text/javascript">

      
      function mainController($scope) {  

        // здесь будем хранить данные, 
        // благодаря тому что  они обьявлены здесь ими могут пользоваться оба контролёра унаследовавших scope
        $scope.items=[
          {label:"Африка",val:25},
          {label:"Европа",val:20}
        ];
        
      }
      
      function tableController($scope) {                                 

        //добавляет строку в таблицу
        $scope.add=function(){          
        	$scope.items.push({val:0});                                 
        };

         // метод не позволяет выставить больше 100%
        $scope.verife=function(item){
          if (item.val>100) item.val=100;         
          if (item.val<0) item.val=0;         
        };
        
      }      
      
      function chartController2($scope) {      
      
      }      
      
    </script>
  </head>
  
  
  <body ng-controller="mainController">
        
    <div ng-controller="chartController2">      
      <div style="height:310px;background-color:#000;padding:5px;">
          <div class="bar" ng-repeat="item in items" style="height:{{item.val*3}}px; margin-top:{{300-item.val*3}}px;">
             {{item.val}}%
          </div>      
      </div>          
    </div>          

    <div ng-controller="tableController">
      <table>
        <tr ng-repeat="item in items">
          <td>
               <input ng-model="item.label"/></td> <td><input ng-model="item.val" ng-change="verife(item)"/>%
          </td>
        </tr>        
      </table> 
    
      <button ng-click="add()">Добавить запись </button>
    </div>
    
  </body>
  

  
</html>
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 27.05.2013 в 02:11.
Ответить с цитированием