标签: angularjs-scope

我试图了解如何使用多个ng-repeat-end's。

我有一个表格，显示了 20 年的数据，分为 5 年的块。

表中的每一行都显示了 5 年的数据。这就是我展示前 1-5 年的方式。

<table>
    <tbody>
        <tr ng-repeat="history in HistoryCategory.Category[key]">
            <th>{{ history.CompanyName }} 1-5 years</th>
            <td ng-repeat="mycredits in history.Histories.slice(0, 5)" ng-switch="mycredits.Status">
                <span ng-switch-when="0">Some text</span>
                <span ng-switch-when="1">Some text</span>
                <span ng-switch-when="2">Some text</span>
                <span ng-switch-when="3">Some text</span>
                <span ng-switch-when="4">Some text</span>
                <span ng-switch-when="null">null</span>
                <span ng-switch-default>Error</span>
            </td>                
        </tr>
    </tbody>
</table>
<div ng-repeat-end class="scroll-btns">
    <div class="scroll-btns">
        <div class="scroll-left icon-left" ng-click="scrollLeft()"></div>
        <div class="scroll-right icon-right" ng-click="scrollRight()"></div>
    </div>
</div>

在表格的底部是一个DIVwith class scroll-btns.. 所有这些都是允许上面的表格可以滚动并显示一些向左/向右移动的图标。

我现在想要做的是展示第 6-10、11-15 和 16-20 年（在同一张表中）。我试过了： …

我有这样的 HTML

  <form ng-controller="testCtrl1">
    <div ng-include="'test/views/navigationbar.html'"></div>
    <div ng-include="'test/views/processnav.html'"></div>
    <div ng-include="'test/views/leftprocesstabs.html'"></div>
   </div>
</form>

我想编写通用方法来检查我所有的 ng-include 文件是否已加载。

加载所有文件后，我需要进行服务器调用。

有没有办法在angular js中检查这个？

我有一个包含数字的字符串列表的 JSON 文件，例如

{
    "MyAccount": "105"
}

在前端，我可以对这个值执行条件吗？IE：

<div ng-if="MyAccount > 100">
   //code ig account greater than 100
</div>

尝试在不必编写任何 JS 的情况下执行此操作，因为此 ng-if 将位于复杂的 ng-repeat 中

我试过了：

<div ng-if="parseInt(MyAccount) > 100">
   //code ig account greater than 100
</div>

是否可以绑定（单向和双向）角度对象但使用动态字符串。

所以而不是做

{{ myObject.name }}

我可以做到这一点，效果很好

{{ myObject['name'] }}

但是如果属性名称位于范围内的另一个变量中怎么办？这不起作用

{{ myObject['{{ anotherVar }}'] }}

这样的事情可能吗？

我正在使用Angularjs 1.4.3制作我的第一个项目。

在我的控制器中，我正在发出一个http请求，在这个 http 请求的成功方法中，我正在更新一个范围变量。在 http 调用中，我获得了最新值，但在视图端它没有更新值。

Plunker 链接 （@rupesh_padhye 谢谢）。（因为它正在调用 servlet 操作，所以不会在Plunker 中显示数据）

app.controller('measuresCtrl', ['$scope', '$modal', '$http', function($scope, $modal, $http) {



    $scope.groups = []
        $scope.loadAllMeasure = function() {
            $http.get("fetchAllMeasure")
            .success(function(data) {
                console.log("Before insert");
                console.log($scope.groups);

                $scope.groups = data.measures;

                console.log("After insert");
                console.log($scope.groups);
            })
            .error(function() {
            });
        };

        $scope.loadAllMeasure();

$scope.submit = function (form) {
$http({
        method: 'POST',
        url: 'saveMeasure',
        data: {
               id: form.id,
               name: form.name,
               description: form.description
              },
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }).success(function(data, status, headers, …

myApp.controller('myController', ['$scope', function($scope) {
    $scope.a = 0;
    $scope.find = function() {
    $scope.a += 1;
  }
}])

.directive('myLoading', [function() {

if ($scope.a % 2 === 0) {
    return {
        template: "<div>Hi</div>"
    }
} else {
    return {
        template: ''
    }
}
}]);

我每次从按钮接收点击事件时都试图操纵DOM.这应该是每次我收到点击时在模板之间切换.但我在控制台日志中收到错误.$scope is not defined,指令中的那个.

这是我的代码:

<div ng-controller="TestController">
    <h1 ng-click="click()">{{person.name}}</h1>
</div>
<script type="text/javascript">
    var app = angular.module('app', []);
    app.controller('TestController', function ($scope) {
        var p = $scope.person = {
            name: 'Br'
        };

        $scope.click = function () {
            p = {};
        }
    });
</script>

当我点击它时<h1>,我重置了p对象,所以我希望h1标签中有空.

因为我认为变量p具有相同的引用$scope.person,它指向同一个对象.

事实上,当我点击时,没有任何改变,只有我重置了$scope.person = {}.

那么为什么它不像我期望的那样工作呢？我的想法有什么问题？

我有以下 html（示例）

<div ng-controller='ctrl-1'>
    <form>
        <input type='text' ng-model='name'/>
    </form>
</div>

和 js 文件为：

app.controller('ctrl-1',function($scope){
    $scope.name = 'john';
});

app.controller('ctrl-2',function($scope){
   /*
    Here I want to change value of 'name' field which is in 'ctrl-1'
    */
});

如何在 angular js 中实现这一点？

我正在开发 AngularJS 应用程序，我想比较文本并突出显示另一个 div 中的差异。下面是我的代码

$scope.left="one two three";
$scope.right="one two four";

<div>{{diff}}</div>

在上面的上下文中，如果我们比较两个作用域的左侧和右侧，我们就会知道 $scope.left 中的“三”是额外的，而 $scope.right 中的“四”是额外的。所以我们需要用红色突出“三”，用绿色突出“四”，这样就很容易找到区别。

有没有我可以使用此功能的插件或库？

我试图在Angular中创建一个自定义复选框指令,我已设法这样做.但问题ng-click是没有调用内置.如果删除自定义指令,则ng-click效果很好.我想这与Scope有关,我仍然缺乏知识.请有人帮帮我.

代码在这里http://jsfiddle.net/bingjie2680/UzM2c/2/.

<div ng-app="components">
    <div ng-controller="MainCtrl">
        <input type="checkbox" ng-model="p.checked" />
         <div checkbox="p.checked" ng-click="test()">test</div>
         {{p.checked}}
    </div>
</div> 

JS:

function MainCtrl($scope){ 
    $scope.p = {checked: false,  name:'test'};
    $scope.$watch('p', function(){

    }, true);

    $scope.test = function(){
        alert('test');
    }
}

angular.module('components', []).
directive('checkbox', function () {
return {
    link : function (scope, ele, attr){
        ele.bind('click', function(){
            ele.toggleClass('active');
            scope.$apply(function(){
                scope.value = ele.hasClass('active');
            });
        });

        scope.$watch('value', function(newv, oldv){
            newv ? ele.addClass('active') : ele.removeClass('active');
        });
    },
    scope : {
        value: '=checkbox'
    }
} …