-3

我正在使用 Ionic 材料演示应用程序,但遇到了一些问题。当我不使用“项目类”时,一切都会好的,但 UI 不符合预期,因为我没有使用该类。代码如下

        <div class="list half" >
        <div  class="card card-gallery item-text-wrap" ng-repeat="picsItem in myPics" > *<!-- no item class here -->*    
            <div class="ink dark-bg">
                <h2>{{picsItem.Title}}</h2>
                <img ng-src="{{picsItem.Image}}" class="full-image" ng-last-repeat="mylist">
            </div>
            <div class="tabs tabs-secondary tabs-icon-left"> *<!-- no item class here -->*
                <a class="tab-item stable-bg assertive">
                    <i class="icon ion-heart"></i>
                    {{picsItem.Like}}
                </a>
                <a class="tab-item stable-bg positive-900">
                    <i class="icon ion-chatbubbles"></i>
                    {{picsItem.Comment}}
                </a>
            </div>
        </div>
    </div>

当我使用“项目类”(根据演示应用程序)时,我面临问题Uncaught TypeError: Cannot read property 'className' of undefined并且没有显示。我为此创建了一支( https://codepen.io/anujsphinx/pen/jVqvaV )。我尝试了一些解决方案(https://github.com/zachfitz/Ionic-Material/issues/46)但没有成功。需要项目类的结果

<div class="list half" >
        <div  class="item card card-gallery item-text-wrap" ng-repeat="picsItem in myPics" >                  
            <div class="ink dark-bg">
                <h2>{{picsItem.Title}}</h2>
                <img ng-src="{{picsItem.Image}}" class="full-image" ng-last-repeat="mylist">
            </div>
            <div class="item tabs tabs-secondary tabs-icon-left">
                <a class="tab-item stable-bg assertive">
                    <i class="icon ion-heart"></i>
                    {{picsItem.Like}}
                </a>
                <a class="tab-item stable-bg positive-900">
                    <i class="icon ion-chatbubbles"></i>
                    {{picsItem.Comment}}
                </a>
            </div>
        </div>
    </div>

我又创造了 2 支笔来解决混乱

  1. http://codepen.io/anujsphinx/pen/yVOdad这是没有 ng-repeat(和 div 中的项目类)的默认代码。我想要使​​用 ng-repeat 的这种类型设计。
  2. http://codepen.io/anujsphinx/pen/yVOdJd这是带有 ng-repeat 的代码(如果我删除项目类,<a href="#/app/profile" class="item item-avatar item-icon-right" ng-repeat="relatives in myRelative">那么它将工作但不正确)。
4

1 回答 1

0

基本上问题不在于 'item' 类,您可以删除 'animate-fade-slide-in' 并且它工作正常......

ionicMaterialMotion.pushDown({
        selector: '.push-down'
    });
    ionicMaterialMotion.fadeSlideInRight({
        selector: '.animate-fade-slide-in .item'
    });

所以.animate-fade-slide-in .item 会影响您的代码..

于 2016-11-14T07:48:52.143 回答