[AngularJS] Accessing Data in HTML -- controllerAs, using promises

复制代码
<!DOCTYPE html>
<html>
<head>
    <title>Access Data From HTML</title>
</head>
<body ng-app="app" ng-controller="TodoCtrl as todoCtrl">

<div ng-repeat="todo in todoCtrl.todos">
    {{todo.item}}
</div>
<form>
    <input type="text" ng-model="newTodo"/>
    <input type="submit" ng-click="todoCtrl.addTodo(newTodo)"/>
</form>
<script src="bower_components/angular/angular.js"></script>
<script src="app.js"></script>
</body>
</html>
复制代码

 

复制代码
/**
 * Created by Answer1215 on 11/29/2014.
 */

function ToDoServices($q, $timeout) {

    var ToDoServices = {};

    ToDoServices.getTodos = function() {
        return $q(function(resolve, reject) {
            $timeout(function() {
                resolve(
                    {
                        todos: [
                            {item: "Clean room", done: false},
                            {item: "Eat lunch", done: false},
                            {item: "Wash car", done: false}
                        ]
                    }
                )
            }, 500);
        });
    };

    ToDoServices.addTodo = function(item) {

        this.todos.push({item: item, done: false})
    }

    return ToDoServices;
}


function TodoCtrl(ToDoServices) {

    var vm = this;
    vm.todos = [];

    vm.getTodos = ToDoServices.getTodos;
    vm.addTodo = ToDoServices.addTodo;

    vm.getTodos(vm.isReject).then(function(res) {
        vm.todos = res.todos;
    });
}

angular.module("app", [])
    .factory("ToDoServices", ToDoServices)
    .controller("TodoCtrl", TodoCtrl);
复制代码

 

posted @   Zhentiw  阅读(162)  评论(0编辑  收藏  举报
(评论功能已被禁用)
编辑推荐:
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
点击右上角即可分享
微信分享提示