无法在AngularJS服务中检索缓存的jQuery选择器

时间:2015-11-28 06:55:06

标签: javascript jquery angularjs jquery-selectors angularjs-service

隐藏元素时遇到一些麻烦。我试图使用AngularJS服务隐藏此元素。我的代码如下:

app.service('testService', function(){
    var testElement = $("#testElement");

    this.hideElement = function(){
        testElement.hide();
    }
});

上面的代码实际上并没有隐藏元素,但是下面的代码确实如此:

app.service('testService', function(){
    this.hideElement = function(){
        var testElement = $("#testElement");
        testElement.hide();
    }
});

但是,我有多个使用testElement的函数,我不想在服务中需要testElement的所有函数中继续声明它。我在这里做错了吗?

3 个答案:

答案 0 :(得分:0)

  

我在这里做错了吗?

是。事实上,你的第一步是错误的。我的意思是在你的情况下隐藏HTML节点的服务可以进行一些DOM操作。服务是数据操作层(检索,转换,保存,发布等)但从不呈现一个,它不应该关心View。服务是可重用的应用程序代码,意味着它应该被注入到应用程序的不同位置以提供数据源的桥梁,它不应该进行任何视图转换,它不是它们的用途。

您应该使用指令作为调解员作为调解员来决定隐藏和显示的时间和内容。最有可能使用内置ngShow / ngHide指令,并在控制器中设置一些布尔标志。

答案 1 :(得分:0)

用于html操作更好地使用角度控制器或内置指令。从不推荐服务。 如果你真的想要缓存一些东西,使用简单的JS常量或html5 localstorage如果缓存会话明智使用sessionstorage,它们真的很有帮助。或者在angular $ rootscope变量中也是全局的。

答案 2 :(得分:0)

是。分配' testElement'在hide方法之外是' testElement'将被赋予未定义的值。因为注入是在dom可用之前创建的。所以下面的代码不起作用。

var testElement = $("#testElement");
this.hideElement = function(){
    testElement.hide();
}

对于DOM操作,最好使用指令而不是服务。