标签: angularjs-scope

如何从父作用域调用子作用域中定义的方法？

function ParentCntl() {
    // I want to call the $scope.get here
}

function ChildCntl($scope) {
    $scope.get = function() {
        return "LOL";    
    }
}

http://jsfiddle.net/wUPdW/

简单问题:如何在html中设置范围值,由我的控制器读取？

var app = angular.module('app', []);

app.controller('MyController', function($scope) {
  console.log($scope.myVar);
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app'>
  <div ng-controller="MyController" app-myVar="test">
    {{myVar}}
  </div>
</div>

JSFiddle:http: //jsfiddle.net/ncapito/YdQcX/

有时我需要$scope.$apply在我的代码中使用,有时它会抛出"正在进行的摘要"错误.所以我开始找到解决这个问题的方法并找到了这个问题:AngularJS:在调用$ scope时预防错误$ digest.$ apply().但是在评论中(以及角度维基上),您可以阅读:

不要做(!$ scope.$$阶段)$ scope.$ apply(),这意味着你的$ scope.$ apply()在调用堆栈中不够高.

所以现在我有两个问题:

1. 为什么这是一个反模式呢？
2. 我怎样才能安全地使用$ scope.$ apply？

防止"正在进行摘要"错误的另一个"解决方案"似乎是使用$ timeout:

$timeout(function() {
  //...
});

这是要走的路吗？它更安全吗？所以这是一个真正的问题:如何完全消除"摘要已经在进行中"错误的可能性？

PS:我只使用$ scope.$ apply适用于非同步的非angularjs回调.(据我所知,你必须使用$ scope.如果你想要应用你的更改,请申请$)

我正在制作一个演示,我会在定期的时间间隔之后从服务器获取数据$interval现在我需要停止/取消它.

我怎么能做到这一点？如果我需要重新启动过程,我应该怎么做？

其次,我还有一个问题:我在重新计算时间间隔后从服务器获取数据.有没有必要使用$scope.apply或$scope.watch？

这是我的傻瓜:

  app.controller('departureContrl',function($scope,test, $interval){
   setData();

   $interval(setData, 1000*30);

   function setData(){
      $scope.loading=true;
    test.stationDashBoard(function(data){
        console.log(data);
        $scope.data=data.data;
        $scope.loading=false;
        //alert(data);
    },function(error){
        alert('error')
    }) ;

   }
});

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

这是主模板的控制器:

app.controller('OverviewCtrl', ['$scope', '$location', '$routeParams', 'websiteService', 'helperService', function($scope, $location, $routeParams, websiteService, helperService) {
    ...     
    $scope.editWebsite = function(id) {
        $location.path('/websites/edit/' + id);
    };
}]);

这是指令:

app.directive('wdaWebsitesOverview', function() {
    return {
        restrict: 'E',
        scope: {
            heading: '=',
            websites: '=',
            editWebsite: '&'
        },
        templateUrl: 'views/websites-overview.html'
    }
});

这是指令在主模板中的应用方式:

<wda-websites-overview heading="'All websites'" websites="websites" edit-website="editWebsite(id)"></wda-websites-overview>

这是从指令模板(website-overview.html)调用的方法:

<td data-ng-click="editWebsite(website.id)">EDIT</td>

问题:单击EDIT时,控制台中会出现此错误:

TypeError:无法使用"in"运算符在1中搜索"editWebsite"

有谁知道这里发生了什么？

我正在尝试ng-click使用自定义angularjs指令设置确认对话框:

app.directive('ngConfirmClick', [
    function(){
        return {
            priority: 1,
            terminal: true,
            link: function (scope, element, attr) {
                var msg = attr.ngConfirmClick || "Are you sure?";
                var clickAction = attr.ngClick;
                element.bind('click',function (event) {
                    if ( window.confirm(msg) ) {
                        scope.$eval(clickAction)
                    }
                });
            }
        };
}])

这很好但很遗憾,使用我的指令在标记内的表达式不会被评估:

<button ng-click="sayHi()" ng-confirm-click="Would you like to say hi?">Say hi to {{ name }}</button>

(这种情况下不评估名称).这似乎是由于我的指令的终端参数.你对解决方法有什么想法吗？

测试我的代码:http: //plnkr.co/edit/EHmRpfwsgSfEFVMgRLgj？p = preview

我想用Angular.factory创建一个AlertFactory.我定义了一个html模板,如下

var template = "<h1>{{title}}</h1>";

标题由呼叫控制器提供并应用如下

var compiled = $compile(template)(scope);
body.append(compiled);

那么,我如何将隔离范围从控制器传递到工厂？我正在使用控制器跟随代码

AlertFactory.open($scope);

但$ scope是全局控制器范围变量.我只想通过标题属性传递一个小范围的工厂.

谢谢.

我无法理解/使用角度UI模式的范围.

虽然这里没有立即显示,但我已经正确设置了模块和所有设置(据我所知),但这些代码示例特别是我发现错误的地方.

index.html(它的重要部分)

<div class="btn-group">
    <button class="btn dropdown-toggle btn-mini" data-toggle="dropdown">
        Actions
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu pull-right text-left">
        <li><a ng-click="addSimpleGroup()">Add Simple</a></li>
        <li><a ng-click="open()">Add Custom</a></li>
        <li class="divider"></li>
        <li><a ng-click="doBulkDelete()">Remove Selected</a></li>
    </ul>
</div>

Controller.js(再次,重要部分)

MyApp.controller('AppListCtrl', function($scope, $modal){
    $scope.name = 'New Name';
    $scope.groupType = 'New Type';

    $scope.open = function(){
        var modalInstance = $modal.open({
            templateUrl: 'partials/create.html',
            controller: 'AppCreateCtrl'
        });
        modalInstance.result.then(function(response){

            // outputs an object {name: 'Custom Name', groupType: 'Custom Type'}
            // despite the user entering customized values
            console.log('response', response);

            // outputs "New Name", which …

我一直在将自定义指令升级到新的组件架构.我读过组件不支持观察者.它是否正确？如果是这样,您如何检测对象的更改？对于一个基本的例子,我有自定义组件myBox,它有一个带有游戏绑定的子组件游戏.如果游戏组件中有更改游戏,我如何在myBox中显示警告消息？我明白有rxJS方法是否有可能纯粹在棱角分明？我的JSFiddle

JavaScript的

var app = angular.module('myApp', []);
app.controller('mainCtrl', function($scope) {

   $scope.name = "Tony Danza";

});

app.component("myBox",  {
      bindings: {},
      controller: function($element) {
        var myBox = this;
        myBox.game = 'World Of warcraft';
        //IF myBox.game changes, show alert message 'NAME CHANGE'
      },
      controllerAs: 'myBox',
      templateUrl: "/template",
      transclude: true
})
app.component("game",  {
      bindings: {game:'='},
      controller: function($element) {
        var game = this;


      },
      controllerAs: 'game',
      templateUrl: "/template2"
})

HTML

<div ng-app="myApp" ng-controller="mainCtrl">
  <script type="text/ng-template" id="/template">
    <div style='width:40%;border:2px solid black;background-color:yellow'> …

我可以在AngularJS范围上设置$ watch,以便在我感兴趣的表达式发生变化时收到通知.但是一旦我失去兴趣,我该如何停止观看？