Heim  >  Artikel  >  Web-Frontend  >  AngularJS-Überwachungsmethode zum Überwachen von Eingabewerten und Anfordern von Daten

AngularJS-Überwachungsmethode zum Überwachen von Eingabewerten und Anfordern von Daten

小云云
小云云Original
2018-03-07 14:21:191912Durchsuche

In diesem Artikel erfahren Sie hauptsächlich, wie AngularJs den Eingabewert überwacht und Daten anfordert.

AngularJS-Überwachungsmethode zum Überwachen von Eingabewerten und Anfordern von Daten

1. HTML-Eingabemenü und versteckte Steuerelemente

<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. Beginnen Sie mit der Verwendung von watch

1 $watch-Steuerung muss initialisiert werden, ng-model="chance.appName"

$scope.chance={
    appName:null};

2 Startüberwachungscode

1. Achten Sie darauf, dass es sich um $watch handelt, mit a Dollarzeichen vorne. Es sind Variablen enthalten und vor den Variablen steht kein $scope

. Wenn der Wert nicht abgerufen wird, sollte die Eingabeaufforderungssteuerung nicht angezeigt werden. Daher wird die Variable $scope.ishaveName= false gesetzt. Beachten Sie, dass der JS-Header auf false initialisiert wird. Nur wenn true angezeigt wird, wird die Eingabeaufforderungssteuerung angezeigt.

3. Ändern Sie bei der Eingabe von $watch die oben genannten 2 $scope .ishaveName ist auf false gesetzt


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

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

                 }
             })
     }

});

3. Backend-Code


1. Controller


@Controller@RequestMapping("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: Wenn das Produkt für die angemeldete Person eingerichtet ist, müssen Sie sich nicht selbst dazu auffordern, aber versuchen Sie, andere so oft wie möglich aufzufordern (Dummköpfe wissen es).


//根据产品名字 ,查看是否有商务经理已经添加了该产品,选则一个不是自己的产品经理@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. Zunächst sollte klar sein, dass es sich hier um den Manager handelt, also sollte der Manager der Kern sein.


<!--根据产品,名字,看出是否已经有商务经理在维护了,根据产品名字 ,查看是否有商务经理已经添加了该产品,如果前台传入的参数我空,则通过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!= &#39;&#39;">            and c.appName = #{_parameter}
        </if>        GROUP by id
    </select>

</mapper>

Verwandte Empfehlungen:

.vue-Dateiüberwachung, Eingabe, Eingabeereignis bei Eingabe, detaillierte Erklärung

Das obige ist der detaillierte Inhalt vonAngularJS-Überwachungsmethode zum Überwachen von Eingabewerten und Anfordern von Daten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn