Question

我有一个Angular 2应用程序，它有一个输入textarea字段：

public interface Api { @Multipart @POST("upload") Call<MyResponse> uploadImage(@Part("image\"; filename=\"myfile.jpg\" ") RequestBody file, @Part("desc") RequestBody desc); }

我们还有一个测试团队，使用Selenium测试框架进行自动化测试。他们试图通过使用

向textarea注入一个值来提交表单

private void uploadFile(File file, String desc) {

        //creating request body for file
        RequestBody requestFile = RequestBody.create(MediaType.parse(getContentResolver().getType(fileUri)), file);
        RequestBody descBody = RequestBody.create(MediaType.parse("text/plain"), desc);

        //The gson builder
        Gson gson = new GsonBuilder()
                .setLenient()
                .create();


        //creating retrofit object
        Retrofit retrofit = new Retrofit.Builder()
                .baseUrl(Api.BASE_URL)
                .addConverterFactory(GsonConverterFactory.create(gson))
                .build();

        //creating our api 
        Api api = retrofit.create(Api.class);

        //creating a call and calling the upload image method 
        Call<MyResponse> call = api.uploadImage(requestFile, descBody);

        //finally performing the call 
        call.enqueue(new Callback<MyResponse>() {
            @Override
            public void onResponse(Call<MyResponse> call, Response<MyResponse> response) {
                if (!response.body().error) {
                    Toast.makeText(getApplicationContext(), "File Uploaded Successfully...", Toast.LENGTH_LONG).show();
                } else {
                    Toast.makeText(getApplicationContext(), "Some error occurred...", Toast.LENGTH_LONG).show();
                }
            }

            @Override
            public void onFailure(Call<MyResponse> call, Throwable t) {
                Toast.makeText(getApplicationContext(), t.getMessage(), Toast.LENGTH_LONG).show();
            }
        });
    }

然而，textarea的文本没有得到更新（我们还使用了其他迭代添加文本，即text（），innerHTML =）。它适用于其他输入类型，例如＆＃39; text＆＃39;，只有textarea没有得到更新。这是一个已知的问题，是否有任何解决方案？

编辑：我还应该注意，我甚至无法更新网站上本地控制台中的值。但是当我删除Angular 2特定属性（即ng-object ng-class）时，我能够更新该值，因此Angular框架和JQuery之间的交互会发生一些事情。

Answer 1

当您使用Angular时，请不要使用JQuery。可能存在一些您可能需要使用JQuery的用例，但如果它们发生的话，这些情况将非常罕见。相反，将一个局部元素引用放在html标记上（如#projectDescription）：

<textarea #projectDescription id="projectDescription" required [(ngModel)]="projectDescription" [formControl]="createNewForm.controls['projectDescription']" style="margin-bottom:-2%;width:50%;"></textarea>

在你的ts中，ElementRef使用@ViewChild就像这样：

@ViewChild('projectDescription') projectDescription: ElementRef;

确保从ViewChild导入ElementRef和@angular/core。

使用以下方法操纵textarea的值：

this.projectDescription.nativeElement.value = "Whatever you want the value to be";

您还可以console.log(this.projectDescription)查看您可以操作的原生元素中的其他内容。

Angular 2 textarea不接受JQuery的价值

1 个答案: