标签: angularjs-directive

ng-bind :连接 2 个值,其中一个是有条件的

我可以使用“+”在 ng-bind 中连接两个值。然而,第二值取决于条件。

如何使用ng-ifng-switch隐藏/显示该值。我尝试使用 ng-if 但它吃了 ng-bind (即插值根本不显示。也许ng-if具有更高的优先级,因为ng-bind的优先级为 0。例如

<a ng-bind="(document.name) + (vm.showifConditionTrue)"></a>

感谢您的任何建议。

javascript angularjs angularjs-directive

1
推荐指数
1
解决办法
2191
查看次数

比较两个文本并找出差异

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

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

<div>{{diff}}</div>
Run Code Online (Sandbox Code Playgroud)

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

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

jquery angularjs angularjs-directive angularjs-scope

1
推荐指数
1
解决办法
3009
查看次数

为什么使用wrap inside指令编译函数会导致无限循环?

我试图在wrap函数内部使用compile函数directive.

以下将导致无限循环并使浏览器崩溃:

function compiler(tElement, tAttrs, transcludeFn) {
    var wrapper = angular.element('<div />');
    tElement.wrap(wrapper);

    return linker;
}
Run Code Online (Sandbox Code Playgroud)

为什么会这样?

angularjs angularjs-directive

0
推荐指数
1
解决办法
880
查看次数

在角度编译已经发生之后,在元素上编译角度

我正在写一个指令,当点击它时,它从服务器加载一个html模板.我如何获得角度来编译它?

编辑:我应该提到模板用于加载到模态.

angularjs angularjs-directive

0
推荐指数
1
解决办法
6464
查看次数

AngularJS UI Bootstrap"btn-radio"指令不起作用

现场演示

任何人都可以解释为什么前两个按钮组工作,但第三个按钮组不工作?

<div class="btn-group">
  <button ng-repeat="company in companies" 
          class="btn" 
          ng-model="radioModel.id" 
          btn-radio="company.id">
    {{company.name}}
  </button>
</div>

<div class="btn-group">
  <button class="btn btn-two" 
          ng-model="radioModel.id"
          btn-radio="2">
    two
  </button>
  <button class="btn btn-two" 
          ng-model="radioModel.id"
          btn-radio="3">
    three
  </button>
</div>

<div class="btn-group">
  <button ng-repeat="company in companies" 
          class="btn btn-{{ company.name }}" 
          ng-model="radioModel.id" 
          btn-radio="company.id">
    {{company.name}}
  </button>
</div>
Run Code Online (Sandbox Code Playgroud)
$scope.companies = [ { id: 2, name: "two"}, {id: 3, name: "three"} ];
$scope.radioModel = { id: 3 };
Run Code Online (Sandbox Code Playgroud)

此示例使用AngularUI Bootstrap 0.5.0.如果我将其更改为0.3.0,一切都按预期工作.

angularjs angularjs-directive angular-ui-bootstrap

0
推荐指数
1
解决办法
7050
查看次数

角度指令中的javascript swiper库

如何在angular js指令中初始化swiper库.

特别是当指令具有使用ng-repeat创建的幻灯片时

这是我第一次尝试使用plukr.
http://plnkr.co/edit/LFV3Y1lxOl8GFmL2M3mP

这是图书馆
http://www.idangero.us/sliders/swiper/

angularjs angularjs-directive

0
推荐指数
1
解决办法
8045
查看次数

AngularJS指令,用于0到1之间的十进制数

我想在AngularJS中使用一个指令,该指令应该允许0到1之间的十进制数.此外,它也可以允许"-1".

例如:-1有效0有效1有效0.12有效0.99有效1.01无效

如果您有任何建议,请告诉我.谢谢.

angularjs angular-ui angularjs-directive angularjs-scope angularjs-ng-repeat

0
推荐指数
1
解决办法
1569
查看次数

当在div体中工作时,ng-show不在表中工作

我在div元素中有两个表.我想在模板加载时隐藏两个表.并希望根据条件显示它们.为此,我在div中创建了两个表,并在两个表中放置了ng-show属性.但是表格是可见的而不是隐藏的 我的代码是

如果我在div中放置相同的ng-show属性它会被隐藏,但是表格不会被隐藏.告诉我这里我做错了什么?帮助将是可观的

<table ng-modal="deferredquiz" ng-show="showdeferredquizz" ng-true-value="true" ng-false-value="false" class="ng-hide">
    <tr>dddddddddddddddddddddd</tr>
        <tr data-ng-repeat="question in quizdata.questions">
            <td ng-switch="question.question_type">


                </td>               
        </tr>
        <tr>

        </tr>
    </table>

    <table ng-show="showimmediatequiz" ng-true-value="yes" ng-false-value="no">
        <tr>

        </tr>
        <tr>
            <td><button ng-click="submitDeferredQuiz()">Submit</button></td>
        </tr>
    </table>
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-directive angularjs-scope angularjs-ng-repeat

0
推荐指数
1
解决办法
2346
查看次数

带有$ http请求的AngularJS指令(inprog错误)

我为此搜索并尝试了很多东西,我想也许我只是做错了.

我有一个单页面应用程序,它具有非常相似的DOM部分,仅通过从服务提供给它们的数据来区分.每个DOM部分都有不同的Web服务.

我的HTML看起来像这样

<div section="foo">
    <ul>
        <li ng-repeat="item in collection">{{item.name}}</li>
    </ul>
</div>
<div section="bar">
    <ul>
        <li ng-repeat="item in collection">{{item.cost}}</li>
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

在我的真实例子中,差异更为显着,所以我不能仅仅将"成本"改为"名称"并让它们相同.

我有一个看起来像这样的指令:

angular.module("App").directive("section", ["BaseProvider", function(provider) {
    return {
        restrict: "A",
        scope: {},
        link: function($scope, element, attrs) {
            provider.query(attrs.section).success(function(response) {
                $scope.collection = response; // ** pay attention to this line **
            });
        }
    };
}]);
Run Code Online (Sandbox Code Playgroud)

所以,它调用BaseProvider的查询方法,传入DOM元素的section属性.所以,在我的例子中,"foo"或"bar".

BaseProvider看起来像这样:

angular.module("App").factory("BaseProvider", ["$http", function($http) {
    var urls = {
        foo: "/something/foo.v1.json",
        bar: "/something/bar.v2.json"
    };

    return {
        query: function(base) {
            return $http.get(urls[base]);
        }
    };
}]); …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-directive angular-http

0
推荐指数
1
解决办法
1098
查看次数

使用浏览器模式的标签在IE中强制关闭IE兼容模式

我正在使用带有angularJs的html5使用follwoing标签

这导致浏览器模式设置为IE8 Compat,文档模式设置为IE8标准.

 <!doctype html>
 <html xmlns:ng="http://angularjs.org" id="ng-app"  ng-app="myApp">

 <meta http-equiv="X-UA-Compatible" content="IE=8" />
Run Code Online (Sandbox Code Playgroud)

这导致浏览器模式="IE8 Compat"和文档模式="IE8标准".

我怎么能强制IE文件模式= IE8标准,所以我的东西将开始工作

html jsp angularjs angularjs-directive angularjs-service

0
推荐指数
1
解决办法
1万
查看次数