Question

我有以下代码：

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" ng-app="app"> <!--<![endif]-->
    <head>

        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"></script>
        <script src="/static/js/ui-bootstrap-tpls-0.10.0.js"></script>
            <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

        <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet"/>
        <script>
            angular.module('app', ['ui.bootstrap']);
        </script>

    </head>
    <body>
        <datepicker></datepicker>
        <timepicker></timepicker>

    </body>
</html>

目前呈现此datepicker和timepicker：

enter image description here

起初，我认为这是我的代码的一个问题，是一个更大的网站的一部分，但在将模板简化为基础之后，我很困惑为什么这不起作用。任何人都可以提供任何有关它无法正常工作的见解吗？

Answer 1

您缺少ng-model，请尝试：

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" ng-app="app"> <!--<![endif]-->
    <head>

        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.9.0/ui-bootstrap-tpls.min.js"></script>
            <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

        <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet"/>
        <script>
            angular.module('app', ['ui.bootstrap']);
        </script>

    </head>
    <body>
        <datepicker ng-model="mymodel"></datepicker>
        <timepicker ng-model="mymodel2"></timepicker>

    </body>
</html>

请参阅this plunker

最小的AngularUI页面功能无法正常工作

1 个答案: