AngularJs watch监听input value并请求数据的方法

企鹅博客
企鹅博客
企鹅博客
25193
文章
0
评论
2020年8月29日03:48:48 评论 35 views

本文主要和大家分享AngularJs watch监听input value并请求数据的方法,希望能帮助到大家。

AngularJs watch监听input value并请求数据的方法

1、html input菜单和隐藏的控件

<p class="form-pider"></p>
<p class="form-item form-remark">
    <p class="item-title"><span class="adError">*</span> 投放产品</p>
    <input name="app" ng-model="chance.appName" type="text" class="item-select" placeholder="请填写产品名称">
</p>
<p ng-if="ishaveName==true" class="margin-top-1 adError">
    该应用已被商务"{{haveName}}"录入国,可保持沟通
</p>

2、watch开始使用

1、JS 必须初始化$watch控件 ,ng-model="chance.appName"

$scope.chance={
    appName:null};

2、开始watch代码

1、一定注意是$watch,前面有美元符。里面是变量,变量前面没有$scope

2、在没有获取到值的情况下,提示控件,应该不显示。所以设置了变量$scope.ishaveName= false,注意JS头部初始化为false,只有当true的时候才会显示提示控件

3、在进入$watch的时候,就将上面2中的$scope.ishaveName设置为false


$scope.chance={
    appName:null};$scope.ishaveName= false;

$scope.$watch('chance.appName',function () {
    $scope.ishaveName= false;     if($scope.chance.appName!=null&&$scope.chance.appName!=undefined&&$scope.chance.appName!=''){         $http.get(ctx+'/chance/findAdminByAppName?appName='+$scope.chance.appName)
             .success(function (data,status) {
                 if(data.result!=null){                     $scope.haveName= data.result.name;                     $scope.ishaveName= true;

                 }
             })
     }

});

3、后端代码


1、controller


@[email protected]("chance")@ResourceFolder(folder = "module/chance/")public class ChanceController {


    @GetMapping("findAdminByAppName")    @ResponseBody
    public ResponseBean findAdminByAppName(String appName){            try {               return ResponseBean.buildSuccess(customerChanceService.findAdminByAppName(appName));
            }catch (AppException e){                return ResponseBean.buildFailure(e.getMessage());
            }
    }
}

2、service,当如果为登录人员自己设置的产品的时候,不需要提示自己,尽可能的提示其他人(傻子知道)。


//根据产品名字 ,查看是否有商务经理已经添加了该产品,选则一个不是自己的产品经理@Overridepublic SysAdminUser findAdminByAppName(String appName) {    if("".equals(appName)||appName==null){        return null;
    }
    Long adminId = CasConfig.RemoteUserUtil.getRemoteUserId();

    List<SysAdminUser> sysAdminUsers = customerMapper.findAdminByAppName(appName);    //有可能会出现多个人,那么首先如果是自己创建的话,就排除掉
    if(sysAdminUsers.size()>0){        if(adminId.compareTo(sysAdminUsers.get(0).getId())==0){
            sysAdminUsers.remove(0);
        }        if(sysAdminUsers.size()>0){            return sysAdminUsers.get(0);
        }
    }    return null;
}

3、mapper

1、首先应该明确,我们这里获取的是管理人,所以要以管理人为核心。


<!--根据产品,名字,看出是否已经有商务经理在维护了,根据产品名字 ,查看是否有商务经理已经添加了该产品,如果前台传入的参数我空,则通过java判断,不能进入本sql,`否则会出错`-->
    <select id="findAdminByAppName" resultType="com.duodian.admore.entity.db.admin.SysAdminUser">        SELECT s.*        FROM `sys_admin_user`  s
        left JOIN  crm_customer_chance c on c.adminId = s.id        where c.isVisible = 1 and c.adminId is not NULL
        <if test="_parameter != null and _parameter!= ''">            and c.appName = #{_parameter}
        </if>        GROUP by id
    </select>

</mapper>

相关推荐:

.vue文件中监听input输入事件oninput详解

以上就是AngularJs watch监听input value并请求数据的方法的详细内容,更多请关注php教程其它相关文章!

继续阅读
企鹅博客
  • 本文由 发表于 2020年8月29日03:48:48
  • 转载请务必保留本文链接:https://www.qieseo.com/396419.html
使用js提交表单form js教程

使用js提交表单form

首先我们先用html创建一个表单 Name: Email: <--一般情况下,这里是使用submit--> 在这个表单中,我们没用使用submit,我们准备使用js来提交这个表单。首先介绍...
js下载以及修改文件名的实例教程 js教程

js下载以及修改文件名的实例教程

这篇文章主要为大家详细介绍了js下载文件并修改文件名的代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 用js下载文件,使用<a>标签,添加download属性即可。 var a =...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: