Я не могу запустить ngAnimate?

У меня проблема с инъекцией зависимости ngAnimate. Я не знаю, почему, но всякий раз, когда я включаю ngAnimate как зависимость внутри моего JS кода не работает ... это не сценарий ...Я не могу запустить ngAnimate?

У меня есть этот HTML код:

<!doctype html> 
<html ng-app="myApp"> 
     <head> 


      <script src=" https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
      <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js"></script> 

      <script src="codebuttonewb.js"></script> 

      <style> 
        .hidden{ 
         display:none; 
        } 
        ul{ 
        //display:flex; 
        margin-bottom:10px; 
        list-style-type: none; 
        } 
        li span{ 
        display:inline-block; 
        line-height:50px; 

        } 
        li img{ 
        margin-right:10px; 
        border-radius:50%; 
        width:50px; 
        height:50px; 
        } 
      </style> 
     </head> 
     <body ng-controller="myController"> 
      <input type="text" ng-model="search" placeholder="search"> 
      <ul ng-class="{'hidden' : !toggle}"><!-- if this value is false then show the class of hidden --> 
       <li ng-repeat="item in list | filter:search" 
        ng-class="item.age>29 ? 'over-thirty' : 'under-thirty'"> 

        <img ng-src="{{item.img}}"/> 
        <span> {{item.name}} - <em>{{item.age}}</em></span> 
       </li> 

      </ul> 
      <button ng-show="!toggle" ng-click="toggle=true" >show names</button> 
      <button ng-show="toggle" ng-click="toggle=false">hide names</button> 
      <form ng-submit="addPerson()"> 

        <input type="text" placeholder="name" ng-model="name"/> 
        <br/> 
        <input type="number" placeholder="age" ng-model="age"/> 
        <br/> 
        <input type="submit" value="submit" /> 

       </form> 

     </body> 

</html>

и этот JS-код:

angular.module('myApp', ['ngAnimate']) 
      .controller("myController",function($scope){ 


       $scope.toggle =true; 


       $scope.list=[ 
       {name:'bla',age:28,img: 'https://s3.amazonaws.com/uifaces/faces/twitter/brad_frost/128.jpg'}, 
       {name:'blabla',age:38,img: 'https://s3.amazonaws.com/uifaces/faces/twitter/mlane/128.jpg'}, 
       {name:'blaba',age:23, img:'https://s3.amazonaws.com/uifaces/faces/twitter/felipenogs/128.jpg'}, 
       {name:'blablala',age:56, img:'https://s3.amazonaws.com/uifaces/faces/twitter/adellecharles/128.jpg'} 
       ]; 


       $scope.addPerson= function(){ 
        $scope.list.push({name:$scope.name,age:$scope.age}); 
        $scope.name=""; 
        $scope.age=""; 
       }; 
      });

Любое решение будет более чем приветствуется. Это мой первый раз, используя ngAnimate, поэтому я думаю, что это, наверное, что-то немое.

источник

2015-06-27 omer

Я не; вижу проблему здесь http://plnkr.co/edit/c0JhEjQUro41eiaOP2Nu?p=preview .. могли бы вы воспроизвести его здесь –

Раньше я сталкивался с подобными проблемами. Попробуйте изменить:

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js"></script>

к:

<script src="https//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js"></script>

источник

2015-06-27 13:02:38 MattDionis

он работал с этим скриптом – omer

<сценарий SRC = "https: // ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js "> – omer

(https: //) – omer

использовать ngAnimate вам нужно добавить любой CSS эффект с ним. Позвольте мне предложить вам некоторые методы анимации-css.

<div class="fade"></div> 
<style> 
/* The starting CSS styles for the enter animation */ 
.fade.ng-enter { 
    transition:0.5s linear all; 
    opacity:0; 
} 

/* The finishing CSS styles for the enter animation */ 
.fade.ng-enter.ng-enter-active { 
    opacity:1; 
} 
</style>

ngAnimate будет onlye ввести нг ввести и нг-активных класса. Вам нужно написать css самостоятельно. Здесь я дал эффект затухания.

источник

2015-06-27 13:06:07 eronax59

Я не могу запустить ngAnimate?

ответ

Смежные вопросы