如何使用服务更改作用域变量?

2024-04-15

我有一个应用程序,应用程序内部有一个注册和登录表单。

通过注册表单,当用户创建帐户时,他们会自动登录。

通过登录表单,用户也可以登录(显然)。

我有两个控制器:一个用于注册表单,一个用于登录表单。我希望他们能够共享一个服务“logIn”,因为两种形式的用户最终都会登录。

到目前为止它正在发挥作用。我唯一的问题是登录表单根据数据库异步检查用户的登录凭据,如果处理此请求的 PHP 脚本返回说不存在匹配,则 Angular 会更新错误消息的模型,如图所示给用户。当“logIn”服务不用作服务而只是复制到两个控制器中时,这种方法工作得非常好。这是它在“SignupCtrl”中的样子:

.controller('SignupCtrl',['$scope','$http',function($scope,$http) {
    $scope.error = false;

    $scope.logIn = function() {
        var data = // user's login credentials

        $http({
            // send credentials to server, ask if there's a match
        })
        .success(function(data) {
            if(data.match === false) {
                $scope.error = true;
            } else {
                // start session, redirect to new page, etc.
            }
        })
    }
}]);

然后,在模板内部:

<div ng-show="error">Oops! That email/password doesn't exist.</div>

这很好用;但正如我所说,当“登录”功能用作服务时则不然。这是因为我不知道如何更新$scope.error服务内部。

我尝试过使用$rootScope(这不起作用):

.service('logIn',[/* injections */, '$rootScope', function(/* injections */, $rootScope) {
    return function(email, password) {
        // all the same code as before

        if(data.match === false) {
            $rootScope.error = true; // this does nothing
        }
    }
}]);

// in the controller (the service is injected in as 'logIn')

$scope.logIn = logIn;

然后,在模板中:

<button ng-click="logIn(user.email, user.password)">Login</button>

用户可以正常登录该服务。问题只是更新$scope.error随服务而变化。

也许如果我能以某种方式做到这一点,它会起作用:

<button ng-click="logIn(user.email, user.password, $scope)">Login</button>

然后在服务中:

return function(email, password, scope) {
   // etc.
   if(data.match === false) {
       scope.error = true;
   }
}

有什么想法吗?谢谢。

小编辑

只是为了澄清,根据我的理解services,它们似乎取代了人们通常声明全局函数的方式,或者只是模块内的整体函数,以避免重复。例子:

(function() {
    function globalFunction() {
        //etc.
    }

    $('.thing').click(globalFunction);

    $('.otherThing').click(globalFunction);
}());

可能有比这更好的例子,但我认为这个想法很清楚。

这个概念与 Angular 内部如何使用服务类似吗?如果没有,是否有更好的方法可以让我在不使用服务的情况下完成我想做的事情?


你可以传入一个$rootScope服务,但污染您的服务通常不是一个好主意$rootScope,但是在这种特殊情况下您的问题是没有强制摘要,因此您的控制器$scope不知道这种变化。在您发布的代码中,如果您包装您的$rootScope.error里面一个$rootScope.$apply()事情会顺利进行的。但回调要干净得多。

我建议您将回调传递到服务方法中,并在回调中设置范围变量:

login:function(email,password,callback){
    $http({
            // send credentials to server, ask if there's a match
        })
        .success(function(data) {
         callback(data.match);
        })
}

在你的控制器中:

$scope.logIn = function() {
    loginServcie.login($scope.email,$scope.password,function(dataIsMatched){
   //you now have the result of call, and dataIsMatched is true or false
    $scope.error = !dataIsMatched;
})
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用服务更改作用域变量? 的相关文章

  • jquery/javascript setInterval

    目前我正在开发一个用户通知提醒消息功能 我设法使用setInterval控制我的 Ajax 调用 检查是否有用户的通知消息 但我的问题是我只想要通知消息 在页面上出现一次 现在它在屏幕上显示多个通知警报消息 我知道你可以使用setTimeo
  • 输入值返回 NaN

    如果有人可以帮助我 因为我不知道为什么控制台中总是有 NaN 一切似乎都很好 该代码应该获取输入值并进行简单的计算 不幸的是 我收到了 NaN 所以我决定使用 console log 来探索值 它向我解释了每个输入的值都是 NaN 我认为这
  • 如何使用 JavaScript 或 jQuery 从 URL 下载文件?

    我使用 jQuery fileDownload 插件从 URL 下载文件 fileDownload url contentType text csv contentDisposition attachment filename url sp
  • 单击浏览器后退按钮时,将用户带回到他们在上一页滚动到的位置

    当用户按下浏览器中的后退按钮时 是否可以将用户带回到他们向下滚动到的页面区域 如 pageA 是屏幕大小的两倍 因此您必须滚动才能阅读更多内容 您单击 pageA 上的链接转到新页面 pageB 阅读后 您在浏览器中单击 返回 现在 当您返
  • 测试 AngularJS 指令的焦点

    如何测试 AngularJS 指令中的焦点 我希望以下内容能够发挥作用 describe focus test function it should focus element function var element
  • Flot 中轴的逗号分隔数字

    有没有办法让 Flot 使轴编号以逗号分隔 例如 用 1 000 000 代替 1000000 您可以通过使用轴的tickFormatter 属性来做到这一点 xaxis tickFormatter function val axis in
  • 如何在 Rollup 中配置从多个输入文件仅生成单个输出文件?

    配置Rollupjs生成库时 如果输入是由多个javascript文件组成的数组 我们如何才能将这些输入生成为一个输出 js 文件呢 export const lgService input src app services livegiv
  • 使用创建的 201 进行重定向

    有没有办法通过 201 答案重定向 RFC规定新创建的资源必须在Location标题 我确实指定了它 我假设浏览器会重定向 但事实并非如此 即使页面没有内容 我希望用户在 POST 操作之后重定向到新资源 因此我很想使用303 See Ot
  • 尝试在 Windows 上执行 package.json 中的脚本会引发 JScript 错误

    所以我正在尝试构建 javascriptair site 在 的里面package json有一个 npm 脚本指向 javascript 命令 package scripts 找到该存储库https github com kentcdod
  • 从 PHP/Web 应用程序打印多个标签到 Dymo LabelWriter 450 Turbo

    我希望添加使用 Dymo LabelWriter 450 Turbo 打印多个标签的功能 我已经从 Dymo 网站下载了 DYMO Label v 8 SDK dmg 但看不到任何 Javascript Web 相关的 SDK 文件或文档
  • 有没有办法在 Blazor 中隐藏 div?

    我正在使用 Blazor 并且想在按下导航栏切换器图标时隐藏侧边栏 列表项崩溃了 但问题是 div 仍然存在 div class page div class sidebar div class nav top row pl 4 navba
  • 无法读取未定义的属性“messageHandlers”

    我想将 JavaScript 变量传递给 Swift 我在 JavaScript 中遇到错误并进行了搜索 但没有得到任何结果 错误是 类型错误 无法读取未定义的属性 messageHandlers 任何人都可以帮忙吗 我在 Xcode 中的
  • Mustache javascript:如何处理布尔值

    我有一个 JavaScript 对象obj键的值可以是true or false 该值被传递给 Mustache 模板 JavaScript 对象 obj like true or false 模板 span like span 现在我希望
  • JavaScript 排序列表

    Javascript 或 jQuery 中有排序列表吗 我有一个巨大的列表 随着时间的推移 插入操作很少 每次添加单个项目时 我无法为整个列表调用 object sort 我需要插入 o log n 不 没有 你拥有的只是Array sor
  • 带条件的 Array.join()

    我该如何使用Array join 有条件的函数 例如 var name aa bb var s name join 输出是 aa bb 我想添加一个条件 仅显示不为空的单词 aa bb 您可以使用Array filter https dev
  • 如何仅使用 Javascript 减慢平滑滚动的默认速度?

    我的目标是按回车键 然后让网站滚动到底部 我已将滚动行为设置为平滑 一切都正常工作 除了平滑滚动的默认速度太快了 我怎样才能减慢它的速度 下面是我的代码 请不要使用jquery 谢谢你 document body onkeyup funct
  • 删除鼠标悬停时的 Vue 自定义过滤器

    我想使用 VueJS 2 删除鼠标悬停时的截断过滤器 这是模板中的过滤器 div class eng word english truncate div 这是过滤器本身 filters truncate function value let
  • 如何检测鼠标指针位于浏览器关闭按钮上时的事件? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 换句话说 这是用于检测事件的 javascript jquery 代码当鼠标指针位于浏览器的关闭按钮 X按钮 上时 或者当鼠标指针进入
  • 尝试利用?

    我看到我的 nopCommerce 网站记录了以下搜索 ADw script AD4 alert 202 ADw script AD4 我有点好奇他们想要完成什么 我搜索了一下 似乎是ADw script AD4 以 UTF7 编码为
  • 反应本机中的“未知命名模块”错误

    我正在使用 React Native 创建一个应用程序 但某些导入会引发标题中的错误 Unknown named module 两个包都会发生这种情况 react native material design and react nativ

随机推荐

  • Javascript 删除事件监听器不工作

    我有以下代码来添加事件监听器 area addEventListener click function event app addSpot event clientX event clientY app addFlag 1 true 它按预
  • 如何防止全景图在 Windows Phone 7 应用程序中从最后一项滚动到第一项

    是否可以防止当用户查看最后一个 PanoramaItem 时 他可以进一步向右滚动 返回到第一个 PanoramaItem 反之亦然 防止通过向左滑动从第一个滚动到最后一个 我问这个是因为在我的应用程序中我有一个只有 2 个 Panoram
  • 将基本 Access 查询条件表示为正则表达式

    我熟悉 Access 的查询和过滤条件 但我不确定如何将类似的语句表达为正则表达式模式 我想知道是否有人可以帮助将他们与我理解的一些简单示例联系起来 如果我使用正则表达式来匹配 Access 等字段 我将如何表达以下语句 示例与此中找到的示
  • 为什么 ImageView 无法在 SystemClock.sleep() 之前更新

    我想在翻转旧图像后 3 秒内在 ImageView 中显示其他图像 代码 OnClickListener oc new OnClickListener Override public void onClick View v ImageVie
  • Jobb 崩溃 FAT 已满

    我尝试使用 jobb 库编译视频 问题是 jobb 崩溃 视频大小超过 500 MB 以下是有关此问题的一些信息 java io IOException FAT Full 459872 459873 at de waldheinz fs f
  • 检查字符串是否是编译时已知的文字字符串?

    我正在编写一个库 并且我有一个接受字典的方法 字典的值是不可信 不安全的 但密钥是可信的 如果最终用户能够输入任意密钥名称 那么可能会发生 坏事 所以当其他开发者使用这个库函数时 我想强制他们在编译时知道键名 所以这样的事情是被允许的 st
  • 不知道如何在给定私钥和消息的情况下生成 ECDSA 签名

    我正在跟进苹果的指南 https developer apple com library ios documentation DataManagement Conceptual CloutKitWebServicesReference Se
  • 两个非常相似的集合之一上的“‘dimnames’[2] 的长度不等于数组范围”

    我在两个数据框中收集了数据vols and flow 后者可以转换为矩阵 但第一个不能 as matrix vols Error in colnames lt tmp value c CanovesSamalus Llinars lengt
  • PHPExcel 一起单元格包含相同的数据问题

    当我使用 PHPExcel 类读取 ods 文件 xls 和 xlsx 都可以 并且两个单元格在一起并包含相同的数据时 第二个单元格变为空白 这是一个错误吗 这是我的代码
  • 解压...缺少参数

    我正在编写一个接受可变数量参数的函数 此外 我希望用户能够将其中一些参数保留为缺失 只考虑转动的任务 到参数列表中 这是我的第一次尝试 f lt function list 这失败了 f 1 2 Error in f 1 2 argumen
  • RSpec 和 ActiveModel

    我有一个模块 它包含 activemodel 我想使用 rspec 测试它 这是我到目前为止的设置 lib my module base rb my module rb spec my module spec rb spec helper
  • 从链接到 Oracle 的 SQL Server 编写 SQL 查询时如何指定日期文字?

    我有一个链接到 Oracle 12 1 数据库的 SQL Server 12 0 数据库 我想在 SQL Server 数据库中创建一个视图 该视图返回按日期筛选的 Oracle 表中的数据 Oracle 表在日期列上有一个索引 成功运行的
  • jQuery Uncaught TypeError:无法读取未定义的属性“fn”(匿名函数)

    全部 我下载的一些代码出现错误 这是代码 wl Alert v 1 1 description Handles alert boxes dependency jquery UI Slider fadeOutSlide plugin fn w
  • Java - 如何使用类文件?

    我是 Java 新手 想知道如何将类文件导入 netbeans 并使用它 我知道类文件是机器可读的字节代码 但我不关心幕后发生了什么 我只想将其导入到我当前的项目中并让它识别它 以便我可以使用该类 此外 类文件嵌入在 JAR 文件中 我将
  • 右对齐文本?

    我试图举一个例子来试验不同的对齐方式作为演示 左对齐 居中 右对齐 对齐和中左对齐文本都很容易 如我的演示所示 你可以看这个例子here http jsbin com avuzuf 1 edit在 JSBin 上 如何获得右对齐的文本而不弄
  • 在骨干模型上声明变量而不设置默认值

    我刚刚开始使用backbone js 我正在寻找一种在模型上声明字段而无需提供默认值的方法 它实际上仅供参考 以便当我开始创建实例时 我可以看到需要初始化哪些字段 用java之类的东西我会写 public class CartLine St
  • Doctrine OneToMany 关系错误

    我试图通过 Symfony2 2 3 0 使用 Doctrine 2 2 3 在数据库中的对象上建立一些 ManyToOne OneToMany 关系 但出现了一个奇怪的错误 以下是对象的相关部分 一种产品的许多属性 Product ORM
  • mongoengine - 忽略架构验证的额外字段

    我正在尝试查询我的数据库 目前 某些记录具有未包含在我的模型架构中的额外字段 由于错误 但我想处理这些情况 当我尝试查询数据库并将记录转换为模式时 出现以下错误 FieldDoesNotExist The field X does not
  • 从旧的 Git 提交中删除私有信息

    我有一个使用 Git 进行版本控制的项目 我想将其开源 但其中包含一些特定于其最初使用环境的私人信息 我将更改相关信息以从未包含在存储库中的配置文件加载 我意识到我应该首先这样做 但由于私人信息仍然存在于之前的提交中 我该如何将其从我的历史
  • 如何使用服务更改作用域变量?

    我有一个应用程序 应用程序内部有一个注册和登录表单 通过注册表单 当用户创建帐户时 他们会自动登录 通过登录表单 用户也可以登录 显然 我有两个控制器 一个用于注册表单 一个用于登录表单 我希望他们能够共享一个服务 logIn 因为两种形式