Question

我在混合应用程序中使用离子框架，该应用程序的页面将显示当前年份。左右两个箭头分别减少和增加年份。该模块在Android上工作正常，但在ios上进行测试时，它会显示一些以年份绑定为前缀的不需要的值。

该值最初看起来很好，但是当绑定得到更新时，它会显示类似这样的内容。代码如下所示。

    (function () {
    angular.module('surprise')
        .controller('calendarController', [calendarController]);
    function calendarController() {
        var ref = this;
        ref.today = moment();
        ref.year = ref.today.year();
        ref.prev = ref.year -1;
        ref.next = ref.year+1;
        ref.isActiveMonth = function(month) {
            if(month === ref.today.month()) {
                return true;
            }
            return false;
        };
        ref.prevYear = function() {
            ref.year -= 1;
            console.log(ref.year);
        };
        ref.nextYear = function() {
            ref.year +=1;
            console.log(ref.year);
        }
    }
})();

视图模板

    <ion-view>
    <ion-nav-title>
        <div class="title header-text">
            <i class="icon"><img src="image/create_icon4.png" class="full_width" /></i>
            <span>{{'CALENDAR' | translate}}</span>
        </div>
    </ion-nav-title>
  <ion-content>
    <section class="recent_row">
    <div class="cale_main">
        <div class="bar bar-subheader year-select">
          <a ng-click="vm.prevYear();" class="align_left"><i class="icon"><img src="image/arrow-left.png" /></i><span>{{vm.prev}}</span></a>
          <h2 class="title">{{vm.year}}</h2>
          <a ng-click="vm.nextYear();" class="align_right"><span>{{vm.next}}</span><i class="icon"><img src="image/arrow-right.png" /></i></a>
        </div>
        <div class="row">
            <div class="menuview_main">
                <ul>
                    <li>

                        <a ui-sref="app.calendarMonth({year:vm.year, month:01})">
                            <img ng-src="{{!vm.isActiveMonth(0) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>January</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:02})">
                            <img ng-src="{{!vm.isActiveMonth(1) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>February</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:03})">
                            <img ng-src="{{!vm.isActiveMonth(2) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>March</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:04})">
                            <img ng-src="{{!vm.isActiveMonth(3) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>April</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:05})">
                            <img ng-src="{{!vm.isActiveMonth(4) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>May</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:06})">
                            <img ng-src="{{!vm.isActiveMonth(5) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>June</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:07})">
                            <img ng-src="{{!vm.isActiveMonth(6) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>July</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:08})">
                            <img ng-src="{{!vm.isActiveMonth(7) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>August</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:09})">
                            <img ng-src="{{!vm.isActiveMonth(8) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>September</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:10})">
                            <img ng-src="{{!vm.isActiveMonth(9) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>October</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:11})">
                            <img ng-src="{{!vm.isActiveMonth(10) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>November</h6>
                        </a>
                    </li>
                    <li>
                        <a ui-sref="app.calendarMonth({year:vm.year, month:12})">
                            <img ng-src="{{!vm.isActiveMonth(11) && 'image/cal-unselect.png' || 'image/cal-select.png'}}"/>
                            <h6>December</h6>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
  </section>
  </ion-content>
</ion-view>

当我在控制台中检查它时，即使在iOS中，该值也显示正常，所以我想这与离子框架的视图更新有关。

Answer 1

我在调试几个小时之后解开了这个谜，这是由iOS将数字转换成带有电话号码的超链接的行为引起的。

解决方案是使用以下元标记

禁用它

<meta name="format-detection" content="telephone=no">

我希望这可以拯救别人的时间和挫败感。更多信息here

离子框架结合显示不需要的值

1 个答案: