angularjs - Meteor+AngularJs 示例

Question

我是 Meteor 和 AngularJs 的新手。我正在尝试遵循https://github.com/lvbreda/Meteor_angularjs上的示例应用程序，但到目前为止我还无法让它工作。

我在这段代码中收到错误“未定义应用程序”：

app.controller('MeteorCtrl', ['$scope', '$meteor', function ($scope, $meteor) {
Uncaught ReferenceError: app is not defined
    $scope.todos = $meteor("todos").find({});
    $meteor("todos").insert({
        name: "Do something",
        done: false
    });

我试图将上面的内容重写为：

var MeteorCtrl = function ($scope, $meteor) {
    $scope.todos = $meteor("todos").find({});
    $meteor("todos").insert({
        name: "Do something",
        done: false
    })
};

仍然抛出错误'错误：未知提供者：$meteorProvider <- $meteor'

在https://github.com/bevanhunt/meteor-angular-leaderboard上的meter+angularjs 的唯一其他示例似乎已过时。

有人可以使用https://github.com/lvbreda/Meteor_angularjs上的包发布一个简单但完全有效的可下载的流星 + angularjs 示例吗？

score 7 · Accepted Answer

我显然有偏见，但我们的团队编写并维护了这个库 - angular-meteor，我们还发布了一个结合两者的教程 - angular-meteor 教程

score 5 · Accepted Answer

虽然我没有使用 lvbreda 的 Angular 包，但我已经能够以相对简单的方式将 Angular 与 Meteor + Blade 集成为 HTML 模板语言。我从 Daniel Olano 的Ng-Meteor包开始，最终实现了我自己的 Meteor/Angular 桥接器。我是 Meteor 和 Angular 的新手，但它似乎运行良好，我喜欢代码非常透明，所以我很好地理解它是如何工作的。

我编写了以下名为 client/ngMeteor.coffee 的 CoffeeScript 模块，它定义了 Meteor 和 Angular 之间的桥梁：

define("ngMeteor", [], ->
  angular.module('ngMeteor.directives', [])

  angular.module('ngMeteor.services', [])

  angular.module('ngMeteor.blade', []).run(['$templateCache', '$rootScope', '$compile',
    ($templateCache, $rootScope, $compile) ->
      bodyTemplate = Template.body
      if !bodyTemplate
        throw new Error("A body template must be defined ('body.blade')")

      # Render each template and place in Angular's template cache
      $templateCache.put "#{key}.blade", render() for own key, render of Template

      # Render the body template and have Angular compile it, then inject it into the DOM's body element
      Meteor.startup(()->
        # Necessary?
        Spark.finalize(document.body)
        $('html').attr('data-ng-app', '')
        $('body').html($compile(bodyTemplate())($rootScope))
        $rootScope.$apply()
      )
  ])
  angular.module 'ngMeteor', ['ngMeteor.blade', 'ngMeteor.services', 'ngMeteor.directives']
)

有关完整的工作示例，请参阅我的这个示例项目。反馈表示赞赏。

score 4 · Accepted Answer

我刚刚创建了一个简单的示例，展示了如何创建一个简单的 angular-meteor 应用程序。

该应用程序显示来自 mongo 集合的一些项目，并且可以通过浏览器控制台实时更新集合。（只是 angular-js 的默认流星功能）

它可以在 github 上找到：https ://github.com/tom-muhm/angular-meteor-example 。

score 2 · Accepted Answer

刚遇到同样的问题。通过添加meteor依赖解决

angular.module('meteorapp', ["meteor"]) # <------------------- Here
.config ['$routeProvider', '$locationProvider', ($routeProvider, $locationProvider) ->
  $locationProvider.html5Mode(true)
  $routeProvider.when '/',
   controller: 'home'
]

score 2 · Accepted Answer

我也是 Meteor 和 Angular 的新手——而且我也很难完成这项工作。但我想我设法让基本的 Angular 功能运行起来。

我发现我放到 github 上：https ://github.com/dirkk0/angularjs-meets-meteorjs

我希望这也对你有用。

score 2 · Accepted Answer

您可以在不同的分叉中找到一些示例 https://github.com/alex-okrushko/Meteor_angularjs

我在https://github.com/linepos/linepos中构建了一个应用程序，但现在它无法正常工作，因为 lvbreda 更改了代码

您可以使用另一种方法https://github.com/kievechua/flame-on

score 1 · Accepted Answer

我自己一直在解决这个问题并为angural做了一个包。示例代码位于：https ://github.com/bramtervoort/meteor-angular-stack/tree/example 示例位于：http ://bramtervoort-todo.meteor.com

它非常简单，只需安装流星并运行：mrt add angular-stack

score -1 · Accepted Answer

我的回答很简单：不要把流星和角混在一起！

你为什么要？对于数据绑定能力？Meteor 为你做的比 Angular 的助手和发布/订阅机制要简单得多。

建立你自己的指令？Meteor 模板和 Blaze 也可以为您做到这一点。

在使用了 angular 很长一段时间后，我最近使用了流星，发现它非常简单：实现相同、更清晰的指令声明的代码更少，在后台为您完成了很多工作，尤其是拉取子集数据的。

流星不需要使用角度，只需使用流星。我还没有找到需要 Angular 的案例。

在meteor中最难掌握的概念是发布订阅模型，但是一旦你掌握了它，它就非常强大，因为你可以通过参数定义将哪些数据推送到客户端。那么你只需要一个模板来渲染它。

查找本文以获取更多详细信息 https://www.discovermeteor.com/blog/understanding-meteor-publications-and-subscriptions/

编辑：2016 年 1 月

查看 Meteor 中 Angular 2 的基准测试，我现在可以看到使用它的理由。以前的版本绝对不是这种情况：

见文章：http: //info.meteor.com/blog/comparing-performance-of-blaze-react-angular-meteor-and-angular-2-with-meteor

Angular 1.x 比 6 个月前的 Blaze 和 React 慢得多。Angular 2 看起来好多了，但我仍然不喜欢过于复杂。

为了简单和快速，还可以查看由前 Angular 负责人构建的Aurelia.io，它旨在与 Javascript 框架本身一起持续和移动。

angularjs - Meteor+AngularJs 示例

8 回答 8

Related

Reference