Understanding Information Retrieval in Document.getElementById in AngularJS

I am developing it with Monaca+nifty mbaaS.
I'm trying to create a login screen, but it doesn't work well.
Also, because AngularJS and JQuery can be mixed, I wrote as follows.
If possible, I would like to write it in AngularJS.

 angular.module('xxx', ['onsen'])
.controller('login',['$scope',ng-click=function(){
    varapi_key="xxxxxxxx";
    varclient_key="yyyyyy";
    varncmb = new NCMB(api_key, client_key);
    var user = ncmb.User();
    user.set("userName", $("#name").val())
    .set("password", $("#pass").val())
    .set("mailAddress", $("#mail").val())
    .set("phone", $("#phone"));

    user.signUpByAccount()
        .then(function($scope){
            alert("Registration Successful";
            console.log("New registration succeeded");
        })
        .catch(function(err){
            alert("Registration failed";
            console.log("New registration failed:");
        });
}]);

How is it correct to write?

monaca angularjs baas

2022-09-30 20:11

2 Answers

You can retrieve each data by using the ng-model tag.
J Add or remove JS/CSS components angularjs Ver=1.5.0.

<!DOCTYPE HTML>
<htmlng-app="myApp">
<head>
    <metacharset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scale=no">
    <meta http-equiv="Content-Security-Policy" content="default-src*data:;style-src*'unsafe-inline';script-src*'unsafe-inline'"unsafe-eval'">
    <script src="components/loader.js"></script>
    <link rel="stylesheet" href="components/loader.css">
    <link rel="stylesheet" href="css/style.css">
    <script>
var app = angular.module("myApp", []);
app.controller("loginController",["$scope", function($scope){
    $scope.user={
        name: '' ,
        password:",
        US>mail: ",
        phone: "
    };
    $scope.userLogin=function(){
        alert("user:"+$scope.user.name+"pass:"+$scope.user.password+"mail:"+$scope.user.mail+"phone:"+$scope.user.phone);
        // write the process here
    };
}]);
    </script>
</head>
<bodying-controller="loginController">
    Name<input type="text" name="name"ng-model="user.name"><br>
    Password <input type="password" name="password"ng-model="user.password">br>
    Mail<input type="email" name="mail"ng-model="user.mail">br>
    Phone<input type="tel" name="phone"ng-model="user.phone">br>
    <input type="button" name="login" value="Login"ng-click="userLogin()">
</body>
</html>

2022-09-30 20:11

The jQuery part is

$("#name").val()

and so on?

AngularJS contains something called jqLite, so you can do something similar to the basic jQuery operation.
You can get $('ng-controller element') by injecting something called $element.
However, the complicated operation using this is because the controller gets messy, so if you want to use it, I think you should transfer the operation using $element to directive later.
Also, as mentioned in the link description, angular.element('selector') can be used as if you were using a selector in jQuery.
Please refer to the following link for restrictions on jqLite.
http://iwb.jp/angularjs-jqlite-howto/

Also, if you simply take the value from the input form, you can see it as $scope.username in the controller by using ng-model="username" in HTML.

2022-09-30 20:11

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656