我试图根据性别生成一个随机的名字和姓氏,并填入表格。我正在使用角度$http
,而且我对角度很新。每次加载
Use of undefined constant firstName - assumed 'firstName'
我的观点:
@section('content')
<form ng-app="getNameApp" ng-controller="getNameController">
Male<input type="radio" ng-model="gender" value="male" name="gender" /><br />
Female<input type="radio" ng-model="gender" value="female" name="gender" /><br />
<input type="text" ng-model="{{ firstName }}" name="firstName" />
<input type="text" ng-if="{{ lastName }}" value="{{ lastName.body }}" name="lastName" />
<button ng-click="randomNameController()">Randomize</button>
</form>
@stop
我的JS
angular.module('getNameApp', [])
.controller('getNameController', getNameController);
function getNameController ($scope, $http) {
$scope.gender = 'male';
var randomName = $http({
url: '/randomName',
method: "GET",
params: {gender: $scope.gender}
});
randomName.success(function(data) {
$scope.firstName = data.firstName;
$scope.lastName = data.lastName;
});
randomName.error(function() {
document.write(randomName);
});
}
我的控制器
public function randomName () {
$faker = Faker\Factory::create();
$gender = Input::get('gender');
if ($gender == 'male') {
$names = [
'firstName' => $faker->firstNameMale
];
} else {
$names = [
'firstName' => $faker->firstNameFemale
];
}
$names['lastName'] = $faker->lastName;
return $names;
}
编辑:我检查了inspect元素的网络选项卡,并用createCharacter显示500内部服务器错误。 (路线到页面)
答案 0 :(得分:1)
我没有看到那种错误,但是你有问题,你正试图从承诺中获取firstName
randomName.success(function() {
$scope.firstName = randomName.firstName; //<-- Here randomName is a promise not data
$scope.lastName = randomName.lastName;
});
而是获取作为success
回调的第一个参数的数据
randomName.success(function(data) {
$scope.firstName = data.firstName;
$scope.lastName = data.lastName;
});
答案 1 :(得分:1)
所以看起来这个问题的直接答案是ng-model=""
上没有括号。话虽这么说,我的代码中存在很多问题,其工作版本如下。希望它可以帮助有类似问题的人。我知道它不是最干净的。
此代码根据性别创建一个随机生成名称的表单。您可以选择性别并点击随机化以填充其他名称。我正在使用https://github.com/fzaninotto/Faker库生成名称。
查看:
<form ng-app="getNameApp" ng-controller="getNameController">
Male<input type="radio" ng-model="gender" value="male" name="gender" /><br />
Female<input type="radio" ng-model="gender" value="female" name="gender" /><br />
<input type="text" ng-model="firstName" name="firstName" />
<input type="text" ng-model="lastName" name="lastName" />
<button ng-click="generate(gender)">Randomize</button>
</form>
JS:
angular.module('getNameApp', []).controller('getNameController', getNameController);
function getNameController($ scope,$ http){ $ scope.gender =&#39;男性&#39 ;;
$scope.generate = function (gender) {
var randomName = $http({
url: '/randomName',
method: "GET",
params: {gender: gender}
});
randomName.success(function (data) {
var names = {
firstName: data.firstName,
lastName: data.lastName
};
$scope.firstName = names.firstName;
$scope.lastName = names.lastName;
});
randomName.error(function () {
document.write(randomName);
});
return $scope;
};
$scope.generate($scope.gender);
}
控制器:
public function randomName () {
$faker = Faker\Factory::create();
$gender = Input::get('gender');
if ($gender == 'male') {
$names = [
'firstName' => $faker->firstNameMale
];
} else if ($gender == 'female') {
$names = [
'firstName' => $faker->firstNameFemale
];
}
$names['lastName'] = $faker->lastName;
return $names;
}