如何使用ng-model实现功能绑定(使用plnkr)

Roh*_*sal 8 javascript angularjs

我有一个dob列,其中的值是yyyy-mm-dd格式,例如2013-01-01,我需要在输入框中显示为1月1日.我可以通过编写函数然后返回精确值来实现从那个功能.但是无法使用ng-model从输入框调用函数,因为它可以在跨度中使用ng-bind调用.我可以理解,在输入框中调用函数会破坏双向绑定.但是我可以使用其他方法.

http://plnkr.co/edit/pZDpypsxM1OA2JwFhjjp?p=preview

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script type="text/javascript" >
    var app = angular.module('app', []);
    app.controller('AppCtrl', function ($scope) {
        $scope.dob = "2013-01-01";
        $scope.getDateOfBirth = function(dob){
            var months = ["Jan","Feb","Mar","Apr","May","June","July","Aug","Sep","Oct","Nov","Dec"]
            var split = dob.split("-");
            return parseInt(split[2])+" "+months[parseInt(split[2])-1];
        }
    });
</script>

<span ng-app="app" ng-controller="AppCtrl" ng-bind="getDateOfBirth(dob)"></span>

<input type="text" ng-model="getDateOfBirth(dob)"/>
Run Code Online (Sandbox Code Playgroud)

zs2*_*020 6

您可以使用ng-init分配函数返回的值并将其分配给模型:

<input ng-init="myDOB = getDateOfBirth(dob);" type="text" ng-model="myDOB">
Run Code Online (Sandbox Code Playgroud)

DEMO

  • 谢谢.但是这样做,它不参与双向绑定,如果我在dob中做了一些更改,它就不会反映在输入框中 (2认同)