在 Angular 指令中设置属性:Radio Button > set > checked = true

Setting Attributes within Angular Directives: Radio Button > set > checked = true

编辑 PLUNKER 示例:http://plnkr.co/edit/WuiCAmMwbQnC0n197LSJ?p=preview 在示例中 "sa" 应该被选中并保持选中状态。它被检查了很短的时间,然后失去了它的检查状态。我现在不知道为什么?


我正在使用经典的老式基于单选按钮的导航选项卡菜单和 Angular-UI-路由器,它运行良好。每次单击选项卡都会获得其 URL.

如果用户在浏览器的地址栏中手动输入URL并回车,就会显示正确的URL内容,也可以。

但是我的选项卡菜单对地址栏中的手动更改没有反应。应选中相应的单选按钮。因此我写了一个指令:

.directive ('checkIfMe', function (){
    return {
        link: function (scope, e, a) {
        ////////////////
            if (currentUrl == currentNaviElement) {
                console.log("Yes it is");
                a.$set("checked", true);
            }
        }
    }

我可以检测到正确的单选按钮,我看到 "yes it is" 并且我想将其 checked 属性设置为 true。我试过:

例如当前单选按钮的ID为"navRadio_sa"

a.$set("checked", true);
a.checked = true;
$('#'+a.id+'').prop("checked",true);

所有这些都不起作用。但我在 firebug 控制台

中尝试了它
$('#navRadio_sa').prop("checked",true);

有效。我的错误在哪里?

最后但并非最不重要的一点是:

试试这个

   .directive('checkIfMe', function ($timeout) {
    return {
        link: function (scope, e, a) {
          scope.my.info.e.push(e);
          scope.my.info.a.push(a);

          console
          $timeout(function(){
            if(a.id == "navRadio_sa") {
              e.prop("checked", true);
              var me = (a.id).replace("navRadio_","");
            }            
          }, 10);

        }
    }

});

e 变量是元素本身的 jQuery 对象。您可以像通常使用 jQuery 对象一样使用它。

我将它包装在 10 毫秒的超时中,以便在操作 dom 之前为 ng-repeat 提供完成时间。看起来 ti 之前由于竞争条件而无法正常工作。通过设置超时,应该可以缓解这个问题。