在角度应用程序中返回 rust-wasm 向量

Question

我有一个基本的 Angular 应用程序和一个 Rust wasm 包，我想在 Angular 中调用 Rust 编译代码中的函数。 Rust 代码模板取自 lib.rs 中的

the rust-pack-template-repo

，如下：

mod utils;
use wasm_bindgen::prelude::*;


#[wasm_bindgen]
pub fn add_one(number: u32) -> u32
{
   number + 1
}

#[wasm_bindgen]
pub fn test_vec_output(num_samples: u32) -> Vec<u32>
{
  let my_vec: Vec<u32> = vec![12; num_samples as usize];

  my_vec
}

在 Angular 应用程序端，我使用以下代码示例来调用 rust-wasm 函数：

async testRustWasmFunctions()
{
import('../wasm-test-pack/pkg/myDummyPackage_bg.wasm').then((response) => {
      this.myFirstResult = response.add_one(1);
      console.log("Test dummy add: " + this.myFirstResult); // Works fine !! returns 2
      console.log("Test dummy vector: " + response.test_vec_output(1,1)); // Only works if I take two arguments
    });
}

在 HTML 部分，函数的调用方式如下：

<button (click)="testRustWasmFunctions()"><\button>

当使用两个参数调用时，

response.test_vec_output(1,1))

函数调用不会返回任何错误（角度），并且控制台结果返回undefined。虽然函数

add_one

工作得很好并返回正确的结果。

有没有比这更好的方法将 rust-wasm pack 导入到 Angular 中，以便轻松处理向量？

Answer 1

您可能需要将

Vec<u32>

转换为 js_sys::Uint32Array。所以你的

test_vec_output

看起来像：

#[wasm_bindgen]
pub fn test_vec_output(num_samples: u32) -> js_sys::Uint32Array {
    let my_vec: Vec<u32> = vec![12; num_samples as usize];
    return js_sys::Uint32Array::from(&my_vec[..]);
}

Answer 2

wasm-bindgen

生成一个js文件（应该称为

myDummyPackage.js

），它负责设置一堆东西（如堆和包装器）。

您可以尝试导入生成的

.js

文件，如果不起作用我建议您查看这些教程：

• 这个教程获取ES模块（您应该使用

  wasm-pack --target web

  ）
• 这个教程设置webpack